프론트엔드 개발자의 기록 공간

웹 개발 프레임워크를 선택하기 위한 15가지 중요한 고려 사항 목적 및 사용 맥락 개발하는 웹 사이트 or 웹 애플리케이션의 목적에 따라 선택해야 합니다. 프로젝트의 목적과 선택한 프레임워크에 대한 이유에 대해서 스스로 묻고 대답해야 합니다. 라이선스 소프트웨어를 사용, 배포 및 수정할 수 있는 법적 계약이므로 중요합니다. 상용 목적으로 사용할 수 있는지, 등에 대한 조건이 있는지 확인해야 합니다. 다른 소프트웨어와 배포와 호환되는지 확인해야 합니다. 문서화 개발자가 프레임워크 기능을 이해하고, 문제를 해결하기 위해서는 공식 문서는 필수적입니다. 예제, 치침, 자습서, 샘플 코드 등을 제공하는 설명서를 찾아야합니다. 문서가 불분명하거나 오랜된 정보라면 프레임워크를 효율적으로 배우고 학습히기 어려울 뿐만 ..

In this article Webpack ESBuild Vite webpack vs vite Module Bundlers JavaScript 모듈을 브라우저에서 실행할 수 있는 파일로 번들링 하는 데 사용되는 프론트엔드 개발 도구로 즉, 여러 개의 모듈 파일들을 하나의 파일로 번들링하는 도구입니다. 특징 모듈화된 코드를 하나의 파일로 번들링할 수 있습니다. 여러 개의 모듈 파일들을 하나의 파일로 번들링함으로써, 웹 페이지의 로딩 속도를 개선할 수 있습니다. 이는 HTTP 요청의 수를 줄이고, 브라우저가 파일을 다운로드하는 시간을 단축시킵니다. 다양한 모듈 시스템을 지원합니다. CommonJS, AMD, ES6 모듈 시스템 등 다양한 모듈 시스템을 지원합니다. 이는 다양한 프로젝트에 적용할 수 있으며, ..

2023.01.09 쏘카에 첫 출근했던 게 엊그제 같은데 벌써 1년이라는 시간이 흘렀습니다. 지난 1년간 좋은 팀원들과 동료들 덕분에 많은 경험을 할 수 있었고, 개발 실력뿐만 아니라 다양한 역량에서 성장할 수 있었습니다. 그중에서 생각이 바뀌게 된 부분과 많은 성장을 했다고 느낀 부분을 정리해 보려고 합니다. [협업과 커뮤니케이션] 대학생 시절부터 여러 대내외 개발 동아리를 활동하면서 커뮤니케이션과 협업활동의 중요성을 알았기 때문에 이런 점에서는 별로 어려움이 없을 것 같았습니다. 하지만, 개발자들끼리 프로젝트를 수행했던 동아리 활동들과 달리, 회사에서는 사업부서, 기획자, 디자이너 등 서비스에 관련된 여러 사람들, 팀과 프로젝트를 수행합니다. 그렇기 때문에 서비스(도메인)에 대한 이해도가 가장 중요했..

CSS Architecture CSS는 자유도가 높은만큼 까다롭고 어렵습니다. 이러한 특성 때문에 종종 기대했던 결과가 나오지 않는 경우가 많습니다. CSS를 계획적으로 구축되지 않았다면 프로젝트가 확장될 때 깨지거나 무너질 가능성이 매우 높습니다. 따라서 견고한 CSS 아키텍처의 기반은 프로젝트가 확장될 때 가장 중요한 요소가 됩니다. 대표적인 예 협업 시 사람마다 다른 코드 구조 및 정의 서로 다른 네이밍 규칙 CSS 우선순위 문제 복잡해지는 선택자 등 CSS Architecture 종류 OOCSS(객체 지향 CSS) BEM(블록 요소 수정자) SMACSS(Scalable and Modular Architecture for CSS) OOCSS (Object Oriented CSS) 객체 지향에 따라서..

Package Managers 컴퓨터의 운영 체제를 위해 일정한 방식으로 컴퓨터 프로그램의 설치, 업그레이드, 구성, 제거 과정을 자동화하는 소프트웨어 도구들의 모임이다. npm npm(node package manager)은 자바스크립트 패키지 매니저입니다. Node.js에서 사용할 수 있는 모듈들을 패키지화하여 모아둔 저장소 역할과 패키지 설치 및 관리를 위한 CLI(Command line interface)를 제공합니다. Node.js 생태계의 앱스토어나 플레이스토어 같은 역할을 합니다. npm 레지스트리에는 640,000개가 넘는 패키지가 포함되어 있으며, 패키지는 의존성(dependencies) 및 버전을 추적할 수 있도록 구성됩니다. package.json package.json은 프로젝트 정..

HTTPS 월드 와이드 웹에서 정보를 주고 받을 수 있는 프로토콜 클라이언트와 서버 사이에 이루어지는 요청/응답(request/response) 프로토콜 HTTP는 암호화하지 않은 평문 데이터 전송이므로,데이터 노출 및 변조의 위험이 있다. HTTPS HTTPS는 TLS/SSL인터넷 암호화 통신 프로토콜을 사용하여 암호화를 통해 평문 데이터 문제 해결한다. (무결성 보장) TLS 는 SSL의 업데이트 버전이라고 이해 서버에서 HTTPS 프로토콜 사용을 위해 SSL 인증서를 CA기관으로부터 발급 받는다. 80번 port를 사용하는 http와 달리 https는 443번 port를 사용한다. HTTPS 동작 과정 클라이언트(브라우저)가 서버로 최초 연결 시도를 함 서버는 SSL 인증서를 브라우저에게 넘겨줌 브..

지인의 소개로 미래산업과학고등학교에 개발자 특강을 다녀왔습니다. 고등학생들에게 특강은 처음이라 무엇을 준비해야 하는지 막막했지만, IT특성화고 특성상 IT관련 대학 진학을 생각하는 학생들이 많았기 때문에, 제가 고등학생 시절 대학 입시를 준비하면서 겪었던 고민들을 정리하기 시작했습니다. 또한, 사전 질문지를 통해 학생들이 어떤 고민과 질문이 있는지 미리 파악했습니다. 정리한 고민들을 토대로 내가 "고등학생으로 돌아간다면"이라고 생각하고 "나는 이렇게 했을 것 같다"라는 주제로 준비했습니다. 또한, 쏘카에 몸을 담고 있어서 회사 소개와 더불어 쏘카에서 어떤 일을 하고 어떤 식으로 일하는지 예시를 통해 현업에 대해서도 소개했습니다. 특강을 진행하면서 학생들의 반응이 조용하길래 "내가 준비한 것이 도움이 되지..