Firebase 파이어 베이스는 2011년 파이어 베이스사가 개발하고 2014년 구글에 인수된 모바일 및 웹 애플리케이션 개발 플랫폼이다. 사용자 인증 , 데이터 리얼타임 처리 , 데이터 보관 등등 백앤드나 서버를 구축해야 할 수 있는 것들을 쉽게 해주는 개발 플랫폼이라고 합니다. Firebase를 이용하면 좋을 때와 안 좋을 때 이용해야 할 때는 개발을 하다 보면 아이디어를 실현시키고 싶을 때가 많은 데 남들이 같은 아이디어로 출시하기 전 실제 사용자들의 반응을 빠르게 받아보고 싶을 때 , 비즈니스 아이디어를 테스트해보고 싶을 때 사용하면 좋습니다. 반대로 사용하면 안 좋을 때는 실제 진지하게 프로젝트를 진행해보고자 할 때 , 혹은 프로젝트를 사업으로 진지하게 임하려고 자세를 취할 때 등등에는 실제 데..
설치방법 npm i redux react-redux store 파일 만들기 import { createStore } from 'redux'; const ADD = 'add'; const DELETE = 'delete'; export const addToDo = (text, id) => { return { type: ADD, text, id }; }; export const deleteToDo = (id) => { return { type: DELETE, id }; }; const reducer = (state = [], action) => { switch (action.type) { case ADD: return [{ text: action.text, id: action.id }, ...state]; c..
예제 배포 링크 https://fervent-hugle-5ea8ae.netlify.app/ 커리어 여정을 행복하게, 원티드 fervent-hugle-5ea8ae.netlify.app 필요한 것 useState, useRef, useEffect import { useState, useRef, useEffect } from "react"; 사용할 오브젝트 const WantedImg = [ "https://static.wanted.co.kr/images/banners/1489/312a0c29.jpg", "https://static.wanted.co.kr/images/banners/1486/fba2df30.jpg", "https://static.wanted.co.kr/images/banners/1468/3df..
어려웠던 부분 5가지 데이터 페이지 1,2,3 합쳐서 보여주기 tsx 반복 사용 검색 query string 사용 youtube api 사용 리액트 컴포넌트 데이터 방식에 따라 prop을 설정하여 재사용하기 React, 노매드 코더 강의// 영화 사이트 만들면서 어려웠던 부분들 5가지 , 후기 깃허브 주소 https://github.com/Gilpop8663/reactmaster GitHub - Gilpop8663/reactmaster: reactmaster reactmaster. Contribute to Gilpop8663/reactmaster development by creating an account on GitHub. github.com 1.20개의 데이터가 나오는 API 호출 후 여러 개의 데..
사용하는 이유 React Query는 종종 React를 위한 누락된 데이터 페칭 라이브러리로 설명되지만, 보다 기술적인 용어로 React 애플리케이션에서 서버 상태를 가져오고, 캐싱하고, 동기화하고, 업데이트하는 것을 미풍스럽게 한다. >>React에서 API 의 정보를 가져오는데 더욱 관리하기 쉽게 해준다는 의미이다. 왜냐하면 React Query 를 사용하지 않을 때에는 data를 처리하는 함수코드와 isLoading 을 처리해주는 함수 , Error 를 처리해주는 함수 등 여러부분을 신경써야 하지만 React Query에는 이미 대부분의 기능들이 내장되어 있어 사용하기만 하면 됩니다. 설치법 $ npm i react-query # or $ yarn add react-query 사용법 1.QueryC..
Selector 란 Selector는 Recoil에서 함수나 파생된 상태를 나타낸다. 주어진 종속성 값 집합에 대해 항상 동일한 값을 반환하는 부작용이 없는 "순수함수" Selector 을 사용해야 하는 이유 최소한의 상태 집합만 atoms에 저장하고 다른 모든 파생되는 데이터는 selectors에 명시한 함수를 통해 효율적으로 계산함으로써 쓸모없는 상태의 보존을 방지한다. https://recoiljs.org/ko/docs/api-reference/core/selector selector(options) | Recoil Selector는 Recoil에서 함수나 파생된 상태를 나타낸다. 주어진 종속성 값 집합에 대해 항상 동일한 값을 반환하는 부작용이 없는 "순수함수"라고 생각하면 된다. get 함수만 ..
설치법 npm install react-hook-form React Hook Form 을 쓰는 것이 좋은 이유 function ToDolist() { const [toDo, setToDo] = useState(""); const onChange = (event: React.FormEvent) => { //console.log(event.currentTarget.value); const { value } = event.currentTarget; setToDo(value); }; const onSubmit = (event: React.FormEvent) => { event.preventDefault(); console.log(toDo); setToDo(""); }; return ( Add ); } 이렇게 기..
Recoil 설치법 npm install recoil yarn add recoil https://recoiljs.org/ko/docs/introduction/getting-started Recoil 시작하기 | Recoil React 애플리케이션 생성하기 recoiljs.org Recoil이 필요한 이유 App 만든 state를 여러 provider에서 사용하려 할 때 계속해서 아래로 전달 전달하는 식으로 사용해야하기에 매우 불편하다 만약 dark,light 모드나 로그인하였을 때 다르게 변하는 state들을 사용하려고 할 때 작업환경이 매우 복잡해질 것이다. 그래서 Recoil 에서는 Atom 이라는 globlaState를 제공하여 원하는 provider에서 바로 불러와서 사용이 가능한 유용한 Reac..
- Total
- Today
- Yesterday
- 우아한테크코스
- 노마드코더
- javascript
- React
- import/order
- 북클럽
- error
- 위코드
- Storybook
- CLASS
- NextRequest
- 스토리 북
- 원티드
- WSL2
- NextApiRequest
- TopLayer
- 프리온보딩
- nodejs
- 아차산
- electron
- env
- 프론트앤드
- C언어
- nextjs
- 노개북
- 윤성우 열혈C프로그래밍
- createPortal
- jest
- 초보
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |