728x90
728x90
오늘은 React 프로젝트에서 자주 사용하는 오픈소스와 라이브러리를 알아보려고 합니다.React 프로젝트를 시작하면서 프론트엔드를 맡게되었는데 프로젝트를 할 때마다 디자이너의 중요성을 세삼 느끼게 됩니다. 디자이너의 유무에 따라서 프로젝트의 퀄리티도 달라지고 사용자 로직에서도 더 편리함을 느낄 수 있다고 생각합니다.그래서 디자이너가 없을 땐 어떻게 해야하나 싶은데 아무래도 색감과 애니메이션이라고 생각합니다.그래서 오늘은 React 반응형 프로젝트에서 사용할 수 있는 오픈소스나 라이브러리를 알아보겠습니다. 자료아래의 자료에 따라서 어떤 오픈소스, 라이브러리가 있는지 알아보겠습니다 (이미 알고 있거나 유명한 것은 예외처리해두었습니다)참고한 자료는 아래와 같습니다. https://www.bloter.net/n..
React로 개발할 때면 항상 Hook의 다양성을 몰라 개발의 효율성이 떨어지는 걸 느낄 수 있었습니다..그래서,React Hook을 파헤쳐보고 알아가면서 프로젝트를 진행하고 있습니다! 그와 동시에 알아가면 좋은(거의 모든) hook들을 공부하며 블로그에 정리해보려고 합니다. 오늘은 useReducer라는 것을 알아보겠습니다. React Hook이란,React 컴포넌트에서 계속 발전되고 업데이트 되고 있는 다양한 React 기능을 사용할 수 있습니다. 내장된 Hook을 이용하거나 이를 결합하여 자신만의 Hook을 만들 수 있습니다.React Hook은 종류가 다양해서 알면 알 수록 신기하고 프로젝트의 효율성을 더 높힐 수 있을 거라고 생각합니다.종류는 다양한데 대표 Hook 들입니다.1. State..
이제 요구사항 모두 작성했고, 깃허브 레파지토리, 프로젝트 생성까지 마무리 했습니다. 매번 새로운 프로젝트를 확인할 때 폴더구조를 제일 먼저 보게 되는데 내 프로젝트가 아닌 이상 폴더구조를 파악하는데 시간이 오래 걸리는 편이었습니다. 물론 파악을 하는 하루 종일 걸리는 건 아니었지만, 이게 어디에 있지? 어디서 import한거지?를 찾는 데 투자한 시간이 아깝다고 느껴졌습니다. 그래서 일단 타입스크립트 프로젝트를 생성할 때 어떤 폴더구조를 찾는지 궁금했습니다. 또한 프로젝트에서 Redux(리덕스)도 사용해보고자 하며 폴더구조에 대해 알아보겠습니다. 기본적인 타입스크립트의 폴더 구조처음 프로젝트를 생성했을 때 볼 수 있는 폴더 구조 입니다.위와 같이 src/, index.html, package.json,..
Redux란? Redux란 JavaScript 애플리케이션에서 클라이언트 사이드의 상태를 관리하기 위한 오픈소스 JavaScript 라이브러리입니다. 주로 React나 Angular와 같은 사용자 인터페이스 라이브러리/프레임워크와 함께 사용되며, 애플리케이션의 상태를 예측 가능하게 만들어줍니다. React나 다른 뷰 라이브러리와 함께 사용할 수 있습니다. Redux는 매우 작지만 사용 가능한 애드온이 많습니다. Single Source of Truth(진실의 단일 출처) : Redux는 애플리케이션의 전체 상태를 하나의 JavaScript객체 트리로 저장합니다. 이 객체 트리는 "Store"라고 부르며, 이것은 앱 내에서 유일합니다. State is Read-Only(상태는 읽기 전용) : Redux에서..
면접 연습을 하면서 면접을 많이 보러 다녔던 친구에게 면접 질문 목록을 받았답니다.. 프론트, 백, 클라우드, SQL 등 총 45개 정도 있어서 하나하나 공부하고 외우면서 포스팅도 함께할 겁니당 React란? 리액트(React)는 페이스북에서 제공해주는 프론트엔드 라이브러리입니다. 자바스크립트 라이브러리의 하나로서 사용자 인터페이스를 만들기 위해 사용합니다. 리액트(React)는 웹 페이지의 복잡한 UI를 효과적으로 관리하기 위해 개발되었으며, "컴포넌트"라는 개념을 중심으로 설계되었습니다. 리액트는 페이스북의 소프트웨어 엔지니어 Jordan Walke가 개발하였습니다. 2013년 5월에 오픈 소스화 되었습니다! 현재 많이 활용되고 있는 프론트엔드 프레임워크 중 Top 3안에 든답니다. React 특징 ..
앱에서 만드는 부분은 산책이라 날씨 api를 넣어야겠다고 생각함 그래서 날씨 api를 쓰려고 한다 https://velog.io/@yhko1992/%EB%82%A0%EC%94%A8-%EC%A0%95%EB%B3%B4-%EB%B0%9B%EC%95%84%EC%98%A4%EA%B8%B0