본문 바로가기

Front-End53

[Front-End] Flutter "open source"는 소프트웨어의 코드가 공개되어 있고, 누구나 해당 소프트웨어를 사용하거나 수정할 수 있는 형태를 가리킨다."Framwork"는 소프트웨어를 개발하기 위한 기본 구조와 함께 특정 작업이나 기능을 수행하기 위한 도구, 규칙 등의 집합체다."Native Compiled"는 안드로이드와 iOS코드로 직접 컴파일(코드변환)이 이루어진다는 것이다."Multi Platform"이란 여러개의 플랫폼(운영체제)에서 사용 가능하도록 개발 가능하다는 뜻이다.  Flutter의 경쟁자들Flutter VS React-Native VS Kotlin 플러터는 개발 경험이 너무 좋기 떄문에 놀라울정도로 빠르게 성장했고, 앞으로 더욱 성장할 것이다. Flutter Mac 설치 커맨드Shell타입 확인 커맨드e.. 2024. 5. 15.
[Front-End] FSD 저도 제일 처음 시작할 때 직면하는 문제 중 하나였습니다. 누가 정해주면 참 좋지만 그게 협업을 하면서도 다 다르게 아키텍처 문제가 발생하니 이 점을 확장할 수 있는 FSD를 보겠습니다. 기능 분할 설계 (Feature-Sliced Design, FSD) 레이어(layer), 슬라이스(slice), 세그먼트(segment)의 세가지 개념을 구분합니다. 레이어 레이어는 최상위 디렉토리이자 애플리케이션 분해의 첫 번째 단계입니다. 레이어의 수는 최대 7개로 제한되어 있으며, 일부는 선택 사항이지만 표준화되어 있습니다. app: 애플리케이션 로직이 초기화되는 곳. Provider, Router, 전역 스타일, 전역 타입 선언 등이 정의 되며, 애플리케이션 진입점 역할을 합니다. processes: 이 레이어는.. 2024. 4. 3.
[Front-End] nvm(npm/node) 설치 아래 코드를 터미널에 입력합니다. /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)" NVM 설치 $ brew install nvm 환경변수 설정 $ echo $SHELL /bin/zsh // or /bin/bash $ sudo vim ~/.zshrc // zsh $ sudo vim ~/.bash_profile // bash nvm -v $ nvm -v 0.39.5 Node 설치 $ nvm install 16 v16.20.2 $ node -v v16.20.2 $ npm -v 8.19.4 $ nvm list // nvm 버전 리스트 $ nvm use 14 // 14 버전으로 낮추기 2024. 3. 17.
Next.js 13 버전과 14버전의 차이 Next.js는 무엇인가? 개발자가 웹서비스를 만들기 위한 필요한 도구를 제공하는 React의 프레임워크다. 라우티, 데이터 패칭, 렌더링 같은 성능 최적화나 개발자 경험 조금 쉽게 생산성 높이 하는 고려를 할 수 있는것. 화면을 그리는 것 외에 성능 seo 전반적인 개발자 도구들을 제공하는 Next.js입니다. pre-rendering Next.js 13 - 파일 시스템 기반의 라우팅: 디렉토리 구조를 어떻게 짜냐에 따라 라우팅이 달라진다는 의미. 12 이하) pages 디렉토리들 기준으로 라우팅을 지원했다. 13) app 디렉토리로 바꾼다. App Directory 13.4 -> App Router - 서버 컴포넌트: React Server Components (RSC) react18에서 도입한 걸 .. 2023. 12. 18.