전체 글 56

bundler

webpack현재 30억 회 이상 다운로드되었을 만큼 강력한 위상을 갖고 있지만, 항상 2가지 한계가 뒤따른다.배포 환경에서 인내 가능한 선을 넘는 느린 속도 / 복잡하고 어려운 설정Rollup.js, ESM(esmodule) 지원 번들러의 등장 - 2015Rollup은 경량화와 번들 최적화를 중점에 둔 esm 모듈 번들러당시 webpack에는 없던 esm(esmodule)을 지원esm 방식의 모듈 import는 의존성 파악을 하는 것이 구조적으로 명확하게 알 수 있다.번들 사이즈 경량화와 최적화에 중점을 둔 번들러현재 각광받고 있는 프론트엔드 빌드 도구인 Vite 번들의 내장 번들러로서도 사용되고 있다.parcel, zero-configuration 번들러의 등장 - 2017'Parcel은 webpac..

WEB 2024.08.21

프론트엔드 배포 가능한 환경 목록

프론트엔드를 배포할 수 있는 환경들은 여러 가지가 있습니다. 각 환경마다 특장점과 단점이 있으며, 사용자의 필요와 프로젝트의 요구 사항에 따라 적합한 선택이 달라질 수 있습니다. 주요 배포 환경과 그에 대한 설명을 아래에 정리했습니다:1. 정적 웹 호스팅 서비스 (Static Site Hosting)예시: GitHub Pages, Netlify, Vercel, Firebase Hosting특장점:쉬운 배포: 코드 푸시와 동시에 자동으로 배포되는 경우가 많음.빠른 로딩 속도: CDN을 통해 전 세계에 빠르게 콘텐츠 제공.무료 요금제: 기본적인 요금제가 무료로 제공되며, 소규모 프로젝트에 적합.단점:동적 기능 제한: 서버 측 로직이나 복잡한 데이터베이스와의 연동이 어렵거나 불가능함.제한된 서버 사이드 기능:..

WEB 2024.08.20

패키지 매니저(npm, pnpm, yarn, yarn-berry)

npm, pnpm, yarn, yarn-berry 패키지 매니저에 대해 조사하여, 상황에 따라 적합한 패키지 매니저를 차용하기 위해 작성한 아티클 입니다. In Writing... 패키지 매니저 별 다운로드 수  패키지 매니저 소개 및 특징yarn & yarn-berryyarn(yet another resource negotiator)은 facebook에서 빌드하고 google, Exponent 및 Tilde에서 지원하는 javascript 패키지 및 종속성 관리자이다.2016년 npm의 대안으로 처음 만들어졌다.yarn 특징offline Mode :  이전에 패키지를 설치했다면 인터넷 연결 없이 다시 설치할 수 있다.Deterministic : 설치 순서에 관계없이 동일한 종속성이 모든 시스템에 동일한..

기타 2024.07.26

(타입스크립트, 리액트, Next.js로 배우는 실전 웹 애플리케이션 개발) Ch1 Next.js와 타입스크립트를 활용한 모던 개발

브라우저 크래시  제이쿼리가 지원했던 크로스 브라우저의 기능? 브라우저 라우터 히스토리(history API와 react-router의 차이?) mvvm - model(데이터를 관리하는 model) /view(화면 표시와 관련된 view) / viewModel(데이터와 표시의 가교 역할을 하는 viewModel) - MVVM에서는 모델로부터 뷰로 데이터를 연동하고, 뷰로부터 모델로 데이터의 양방향 바인딩을 수행하는 아키텍처 - 선언적 UI - https://react.dev/learn/reacting-to-input-with-state#how-declarative-ui-compares-to-imperative React  - 브라우저의 구현에 의존하지 않는 형태로 DOM을 삽입할 수 있어서 나중에는 서버..

next.js 2024.07.25

(타입스크립트, 리액트, Next.js로 배우는 실전 웹 애플리케이션 개발) Ch2 타입스크립트 기초

튜플을 활용하면 좋은 상황// chatGPT의 답변데이터 구조가 고정되고 각 요소의 타입이 명확히 정의되는 상황에서 큰 도움이 됩니다. 이를 통해 타입 안전성을 높이고 코드의 명확성을 개선할 수 있습니다. 타입추론타입스크립트 타입 추론은 대입할 대상 변수값의 타입이 결정되어 있을 때, 대입할 값과 타입이 일치하지 않는 경우 에러가 발생하는 추론 기능도 있습니다. 자바스크립트를 실행할 때 window 객체는 표준으로 갖는다.  -> window 객체는 JS에서 제공하는 것이 아닌, 모든 브라우저에서 제공하는 객체이다.  -> BOM(Broswer Object Model)      브라우저 창이 열리면 가장 먼저 window 객체가 만들어지고, 그 하위에 브라우저 각 요소에 해당하는 객체가 만들어진다.   ..

next.js 2024.07.25

DB 관련 용어 정리( fact table, dimension table, transaction entity, master entity etc... )

회사 내 온보딩 기간을 거치면서, DB 관련하여 모르는 내용이 많다는 생각을 하게 되었다. 업무에 보다 잘 적응하기 위해 DB 관련 용어를 조사하여 정리하였다.데이터 웨어하우징 영역에서 star 스키마와 snowflake 스키마는 방대한 양의 데이터를 효율적으로 구성하는 데 중요한 역할을 한다.https://www.integrate.io/ko/blog/snowflake-schemas-vs-star-schemas-what-are-they-and-how-are-they-different-ko/star schema좀 더 직관적임, 차원 테이블은 정규화 되지 않음. 팩트 테이블과 차원 테이블만 조인하여 SQL 쿼리를 더 간단하고 빠르게 만든다. 단순한 관계가 있는 데이터마트에 적합.단일 팩트 테이블이 여러 차원..

CS 2024.05.24

FE 개발자 멘토링 피드백 정리

FE 개발자로 가고 있는 방향이 답답하다고 느낄 때쯤, 인프런에서 멘토링을 신청하게 되었다. 이 때 질문할 내용들을 작성하고, 얻은 답변들을 기록한 글이다. * 이력서 피드백(어떻게 하면 떨어지지 않는 이력서를 만들 수 있을까요?) * 이직할 때 갖춰야 할 스킬(테크 및 소프트, 마인드 셋 등) 및 노하우 * FE 개발자로 걸아가야할 방향 * 빠르게 성장할 수 있는 방법 * 퇴사 후 이직 준비에 대한 의견(배울 것이 거의 없다고 느껴져,, 선퇴사에 대해 고민 중입니다.) * 기타 질문 1. 결혼하고 출산하면 개발자로 성장하기가 어려운지 2. 노코드 시대에 FE 개발자들이 먼저 AI에게 대체될 것인지(이에 어떻게 대비하면 좋을지, 멘토님은 어떻게 생각하시고 어떻게 미래를 준비 중이신지) [ 이력서 ] 이력..

이직 2024.03.09

24년 6주차 회고(24.2.5 ~ 2.9)

이번주는 퇴사 고민을 많이 했던 시간들이였다. FE 개발자로서 어떠한 성장과 학습을 하고 있는가에 대한 고민이 깊어지던 시기에 FE 개발자들이 많은 곳, 실력 있는 FE 개발자들이 있는 곳으로 옮겨 가야겠다는 생각을 확고하게 했던 시간이였다. 돌아가지 못하도록 배를 불태웠던 장수들의 심정과 같이 이직이 확정되지 않았지만, 선퇴사를 한 후에 다른 회사들을 준비 해야겠다는 결단을 했었던 것 같다. 그런데, Youtube에서 이직 전 나에게 직장이 아닌 직업이 있냐고 묻는 영상을 보며, 아직 퇴사를 하기에는 좀 이르다는 판단과 현재의 직장에서 다양한 경험들을 해볼 수 있는 기회비용을 놓치는 것이 아쉬워 들어 퇴사를 유보하게 되었다. 성과를 미쳐 내지 못한 여러 영역들에서 가시적인 성과를 거두고, 대리라는 직급..

기타 2024.02.08

24년 4주차 회고(24.1.22 ~ 1.26)

이번주는 A형 독감에 심하게 시달렸다. 월욜 오전부터 감기 기운이 보이다가 점심 이후에는 어떻게 업무를 했을지도 모를 정도로 정신이 혼미했던 것 같다. 회사 서비스를 새로운 클라이언트가 하필 이번주 부터 실사용하게 되어서, 정신이 더욱 없었던 한 주 였었다. 이런 상황으로 쎄함을 느낀 다음 날(화요일) 휴가 쓰기도 조심스러워 고민하다가 결국 당일 아침에 오전만 쉬다 가면 괜찮겠지 하고 반차를 썼지만, 도저히 안될 것 같아 오후도 반차를 내었던 한 주였다..🥹 그래서 공부도 많이 못하고, 업무에도 더 불태우지 못해 아쉬웠던 한 주였다.. 4주차를 회고하는 지금은 많이 좋아졌으니, 다시금 달려가 봐야겠다! 그리고 평소 아프지 않도록 틈틈히 건강을 챙길 수 있어야 겠다. 시간을 아껴야 하는데... 이런 걸로 ..

기타 2024.01.26

24년 3주차 회고(24.1.15 ~ 1.19)

3주차 회고를 쓰는 날에 약속이 잡혀 회고글 작성이 미뤄졌다. 회고 쓰는 금욜 저녁에 약속이 잡혀 있다면 미리 회고글을 작성할 수 있는 대안을 마련해야겠다. * 개발 1주차 회고 개발 파트에 적어 놓았던 2번째 부분(https://searching-power.tistory.com/32)에 대해 해결책을 찾게 되었다. 클라이언트 딴에서 보내는 데이터를 서버 쪽 미들웨어 단에서 body Parser 라이브러리를 사용하도록 설정하는데, json limit과 text limit 을 초과하여 발생한 이슈였다. 이러한 케이스도 있다는 신기한 경험을 했었다. 24년 1주차 회고(24.1.1 ~ 1.5) 회고라는 것을 처음 작성해 본다. 회사에서 프로젝트 내 스프린트가 끝날 때마다 회고를 하긴 했지만, 목적없는..? ..

기타 2024.01.26