You Can Become A
늦게 시작해도 누구든지 노력하면 개발자가 될수 있어요 !
🔮 PurgeCSS 사용법 - CSS 프레임워크 코드 최적화
CSS 프레임워크의 문제점 웹 어플리케이션을 구축할때 서비스 품질과 성능도 중요하지만, 빠지지 않는 것이 웹디자인이다. 웹디자인은 사용자의 첫인상과 만족도에 큰 영향을 미치기 때문에 신경써야 한다. 하지만 웹디자인을 처음부터 만드는 것은 쉽지 않다. 복잡한 CSS 코드를 작성하고 반응형으로 만들고 호환성을 확인하는 과정은 많은 시간과 노력이 필요하기 때문이다. 그래서 많은 웹 개발자들은 Bootstrap, Foundation, Bulma, Pure.css, UIKit, Materialise, Tailwind와 같은 CSS 프레임워크를 사용한다. CSS 프레임워크는 미리 정의된 CSS 클래스와 구성 요소를 제공하여, 일관되고 표준화된 방식으로 쉽고 빠르게 고퀄리티의 웹디자인을 만들 수 있으며, 재사용하고 ..
🚀 모바일 / 태블릿 에서만 CSS 파일 로드 최적화
CSS 파일 로드 최적화 보통 태그의 css 파일 로드는 브라우저의 렌더링을 차단(blocking) 하기 때문에, css 파일이 크면 클수록 그만큼 웹페이지 속도에 영향을 미치게 된다. 따라서 왠만해선 css 파일의 용량을 최적화하여 줄이는 것이 좋으며 소스를 분리할 수 있는 것은 따로 분리하여 비동기 로드 시키는 것이 좋다. 예를들어 모바일 혹은 태블릿에서만 실행되는 미디어쿼리 선택자 부분은 메인 css 파일에 한꺼번에 때려넣기에는 약간 무리가 있다. 이때 모바일 소스를 다른 css 파일로 분리하고, 사용자의 화면 비율에 따라 선택적으로 css 파일을 로드하도록 하는 방법이 있는데, 이는 다음과 같다. css 파일을 분할하여 메인 css의 크기가 작아지는 효과도 있고 별도로 모바일, 태블릿 화면의 cs..
