생각, 그 이상을 초월하는 무언가

React는 사용자 인터페이스 구축을 위한 인기 있는 JavaScript 라이브러리이며 실제 애플리케이션을 구축할 때 많은 개발자가 선택하는 선택지가 되었습니다. 이 기사에서는 실제 React 앱을 구축하는 데 관련된 몇 가지 주요 단계를 다룰 것입니다. 요구 사항 정의: 앱 구축을 시작하기 전에 달성하려는 것을 이해하는 것이 중요합니다. 앱의 목표, 대상 고객 및 주요 기능을 정의합니다. 이렇게 하면 사용할 기술 스택과 개발 프로세스에 대해 정보에 입각한 결정을 내리는 데 도움이 됩니다. 기술 스택 선택: React는 다양한 도구 및 라이브러리와 함께 사용하여 실제 앱을 구축할 수 있습니다. 인기 있는 선택으로는 상태 관리를 위한 Redux, 라우팅을 위한 React Router, API 호출을 위한 ..

성능 최적화는 프런트 엔드 개발의 중요한 측면이며 React 애플리케이션도 예외는 아닙니다. React 앱의 성능을 개선하면 로드 시간을 줄이고 사용자 경험을 개선하며 앱의 확장성을 높일 수 있습니다. 다음은 React 애플리케이션의 성능을 최적화하기 위한 몇 가지 팁입니다. 메모이제이션 사용: 메모이제이션은 함수의 결과를 캐시하고 가능할 때마다 다시 계산하지 않도록 하는 기술입니다. React에서는 useMemo 후크를 사용하여 비용이 많이 드는 계산을 메모하고 구성 요소의 성능을 향상시킬 수 있습니다. shouldComponentUpdate 수명 주기 메서드 사용: shouldComponentUpdate 메서드를 사용하면 구성 요소가 다시 렌더링되는 시기를 제어할 수 있습니다. 이 방법을 사용하면 불..

Redux와 React 컨텍스트: 포괄적인 비교 React 애플리케이션의 상태 관리와 관련하여 널리 사용되는 두 가지 옵션은 Redux와 React 컨텍스트입니다. 둘 다 고유한 강점과 약점이 있으며 둘 사이의 선택은 개발 프로세스와 코드의 전반적인 품질에 큰 영향을 미칠 수 있습니다. 이 기사에서는 두 가지를 비교하여 각각의 주요 차이점, 사용 사례 및 모범 사례를 강조합니다. 리덕스: Redux는 React를 위해 특별히 만들어진 인기 있는 상태 관리 라이브러리입니다. 단일 전역 저장소를 사용하여 응용 프로그램의 모든 구성 요소에서 액세스하고 업데이트할 수 있는 응용 프로그램의 상태를 저장합니다. Redux는 리듀서라는 순수 함수를 사용하여 상태를 업데이트합니다. 이는 리듀서가 호출될 때만 상태가 업..

리액트의 심화 5주차짜리 강의가 이번에 새로 들어왔다. 반가운마음에 빠르게 일단 아침에 하는 일일 알고리즘부터 빠르게 풀고, 리액트 심화 강의를 들었다. 그리고 현재 1주차를 모두 듣고 2주차 단계에 있다. 사실 심화라고는 하지만 크게 어려운부분은 없는것 같다. 배운것을 다시 복습하고 기존에 배웠던 것에 대해, 인과관계 혹은 효율성, 나오게된 계기 등등 을 배웠다. 심층적인것 뿐만 아니라 기본부터 쭉 복습을 하게되어 좋았고, 무엇보다 리액트는 실습하는것이 최고의 학습이라고 생각되기에 실습하는부분이 어느정도는 있어서 좋았다. 리액트 5주차까지 듣고, 이전 프로젝트에서 파이어베이스의 값 할당부분에 대해 조금 더 복습하면 거의 나혼자 리액트 프로젝트 하나는 만들 수 있을거라는 생각이 든다.

이번주는 뭔가 용두사미로 가는 느낌이었다. 월요일쯤부터는 리액트 입문강의를 다 듣고 개인과제도 잘 해내어 좋았으나, 리액트 숙련강의를 다 듣고 개인과제를 완벽히 해내는 부분이 어려웠다. 그래서 나머지 시간을 리액트 공식문서에서 어느정도 리액트에 숙달되도록 많이 문서를 보고 vs로 같이 코드도 작성하면서 이해하려고 했으며, 잘 성장한건지는 스스로는 의문이다. 다음주부터는 내 성장의 지표에 대해서 좀 더 잘 파악하기위해 팀원들과도 적극적으로 소통하면서 내 위치가 적당한지 아니면 부족한지에 대해서 조금더 알아봐야겠다.

오늘은 크게 뭔가 많은 것을 하지는 않았다. 특강자료를 보고, 리액트 강의를 대략적으로 보면서 아직은 익숙하지 않은 부분에 대해서 알아보기 위해, 리액트 공식문서 처음부터 보고 있다. https://ko.reactjs.org/ React – 사용자 인터페이스를 만들기 위한 JavaScript 라이브러리 A JavaScript library for building user interfaces ko.reactjs.org 리액트를 입문하는데 있어서 꽤 유용한 사이트이다. 다만 완전히 아무것도 모르는 상태에서 보기보다는, 어느정도의 html, css, js의 기본을 알고 봐야 이해가 갈 것 같다.

오늘 대단히 많은 공부와 작업을 동시에 모두 해냈다 ㅎㅎ 일단 어제부터 고민이었던 개인과제를 해냈고 다음과 같이 vercel을 통해 도메인을 등록해놨다. https://react-first-project-indol.vercel.app/ React App react-first-project-indol.vercel.app 그리고 입문과정을 다시한번 전체 강의를 복습하여 개념정리를 하고(주로 props와 state), 리액트 숙련과정 1주차의 절반까지 들었는데, 숙련과정은 역시 처음 들었을때 복잡함이 느껴졌다. 다음과 같은 애니메이션을 일단 숙달해야되는데, 이 흐름과 리덕스의 전체구조, 그리고 이전에 배웠던 로컬state와 새로배운 전역state의 개념을 분리하는 연습을 하고 있다. 사실 말만 거창하고 지금 ..

https://react-first-project-indol.vercel.app/ React App react-first-project-indol.vercel.app 내가 1주차를 마치고 만든 프로젝트이다. 그냥 따라서 만든거에 배경화면이랑 css만 조금 수정한게 전부이지만 ㅋㅋ 그래도 나름 꾸며보니까 좀 나아보인다. 참고로 앱으로 보면 버튼이나 화면이 제대로 다 나오지 않고 깨져서 나온다ㅠㅠ 이것을 반응형으로 해서 앱에서도 잘 버튼이나 배경화면이 나올수 있도록 고민해보는것도 좋겠다. 오늘은 하루만에 리액트 입문강의를 모두 듣고 , 개인과제에 도전중이다. 생각보다 css부분에서 좀 많이 걸린다. 역시 css는 내게 아직 취약한 부분이고, js부분은 어느정도 감이 잡힌다. 지금은 css를 적당히 완성하고 ..

이번주차에서는 나 혼자만이 아니라, 개개인이 팀을 이루어 팀 단위로 무언가의 프로젝트를 해내고 발표하며, 제출 및 보고 까지 하는 과정을 거쳤다. 사실 어려운 부분이라기 보다는, 스스로 느끼는 부담감이 많이 컸었던것 같았다. 나 스스로 프로젝트를 한다면 간결하게 과정의 처음, 중간, 마지막까지 계획을 짜서 할 수 있었지만, 팀원의 성향 및 실력 그리고 방향 또한 확인해야되는 부분이기에, 간단한것이라도 그만큼 시간이 다소 걸렸다. 아무래도 첫 미니프로젝트를 팀장의 역할로 수행하여 진행하다보니 느끼는 개인적인 부담감이 있었던것 같으며, 이부분 또한 극복해야될 과제이지 않을 까 싶다. 이번 주차에서 가장 중요하게 생각한 부분은 자신감이다. 프로젝트를 하기 전의 개개인의 과제나 할일에 대해서는 부담이 없었고 충..

이번 주차는 먼저 팀이름을 정하고, 어떤 프로젝트를 만들지 선정하였다. 그리고 그 프로젝트에서 구현하고자 하는 기능을 각 인원마다 선정하였으며, 도중하차하는 인원이 생기어 다소 아쉽긴 했으나 그래도 프로젝트는 무사히 완성되었다. 1주차 동안의 느낀점 ---------A반 2조 팀원--------------- 선형 ------ keep 서로 모르는 코딩에 대해 찬찬히 설명해준 것 협업할 떄 git과 github 사용한 것 잘 안될 떄 서로 정보를 공유하며 해결하려고 노력한 점 코딩 할때 주석을 잘 달아준 것 problem 맨 처음 S.A를 쓰면서 기회기 할 때 구현할 기능과 와이어프레임에 대해 다양하게 논의하지 않은 것 초반에 간략하게 잡아놓은 기획에서 더 나아가지 못한 것 git을 잘 쓸 줄 몰라 방법을..