맥북 초기세팅 iTerm2 설치(기본 터미널보다 많은 기능 제공) 설치링크 node 설치 brew install node homebrew 설치 /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)" vscode 설치 brew install --cask visual-studio-code Oh-My-zsh 설치 sh -c "$(curl -fsSL https://raw.github.com/robbyrussell/oh-my-zsh/master/tools/install.sh)" zsh 플러그인 설치 git clone https://github.com/zsh-users/zsh-autosuggestio..
프론트엔드 기술 스택의 전망이 궁금해서 패키지 비교 사이트에서 찾아서 정리해보았다. 제일 인기가 많은 라이브러리는 기울임, 밑줄 표시해두었다. 애니메이션 라이브러리 Compare NPM Packages: Find the Best npm Package for Your Project npm-compare.com GSAP gsap GSAP is a robust JavaScript toolset that turns developers into animation superheroes. Build high-performance animations that work in **every** major browser. Animate CSS, SVG, canvas, React, Vue, WebGL, colors, stri..
13주차 회고 (23.8.14.~8.18) - 어떤 것을 배웠고, 실천하였는가 리액트 수업 2주차 째. 광복절이 껴있어서 수업은 4일을 진행했는데, useState를 좀더 깊게 알아보고, 리액트의 생명주기와 포켓베이스를 활용해서 서버의 데이터 가져오기 그리고 리액트 라우터를 맛보는 시간들이었다. 월요일과 수요일에는 리액트를 어려워하는 분들을 대상으로 하는 보충강의, 그리고 금요일에는 중급자들을 대상으로 하는 함수형 프로그래밍 깊게 파보는 강의가 있었다. - 느낀 점 야무쌤에게 리액트를 배우고 있음에 굉장히 감사함을 느끼는 요즘이다. 리액트 18버전으로 찍으신 온라인 컨텐츠와 함께 야무쌤에게 정규시간에 듣는 강의를 예습 복습하니, 리액트에 대한 감이 조금씩 생기기 시작하는 것 같다. 정규수업과 별개로 주에..
멋사에서 리액트를 공부하는 중에, 리액트에서 렌더링이 어떻게 이뤄지는지 익힘으로써, 앞으로 리액트에서 어떤 작업을 하더라도 설계한 대로 될 수 있도록 정리해보고자 한다. React에서의 렌더링 리액트의 렌더링 과정은 크게 세 단계(Trigger - Render - Commit)로 나뉜다. Trigger(Render Trigger) // main.jsx(or index.jsx) ReactDOM.createRoot(document.getElementById('root')).render( );위 코드를 실행하면서 리액트 렌더링 프로세스가 시작된다. 렌더링 트리거 단계에서는 애플리케이션에 변경사항이 발생할 때 새로운 렌더링을 시작하는데, 주요 트리거는 다음과 같다. 초기 렌더링: 컴포넌트 최초 생..