괘종소리 세기

리액트의 Redux처럼 모든 모듈에서 접근할 수 있도록 하는 데이터가 필요하다면 Alpine.store 객체를 사용할 수 있습니다. store.js라는 파일을 하나 만들어서 거기에 Alpine.store를 정의하고, html에서 불러와서 사용할 수 있도록 합니다. // store.js Alpine.store("global", { open: false, toggleOpen() { this.open = !this.open; } }); store에는 변수와 메소드를 정의할 수 있습니다. global이라는 이름으로 store를 정의합니다. // index.js document.addEventListener("alpine:init", () => { Alpine.data("test", () => ({ store: ..

리액트나 앵귤러 같은 웹 프레임워크가 편하기는 하지만 비교적 소규모 프로젝트를 빠르게 개발하고자 할 때 Tailwind와 Alpine.js를 사용함으로써 얻는 장점을 무시할 수 없다고 합니다. 현재 회사에서 새 프로젝트 시작과 함께 도입되었습니다. Tailwind CSS Tailwind CSS는 기존 .css 파일에 스타일을 세팅하는 방식이 아닌, html 태그 안 클래스 이름에 스타일을 입력하는 웹 프레임워크입니다. 자주 쓰는 스타일에 대한 정형화된 클래스 키워드를 제공해주는 게 마치 매크로 느낌이랄까요... 장점은 1. 클래스 이름을 짓느라 시간을 쓸 필요가 없다. 2. 제공된 클래스를 이용하면 스타일을 빠르게 적용할 수 있다. 3. css 파일을 따로 만들지 않으니 코드 길이가 줄어든다. 단점은 1..