분류 전체보기153 [REACT] 16. Firebase [REACT] 16. Firebase Contents 01 Firebase란? 02 프로젝트 생성 03 Cloud Firestore 데이터 추가하기 어플리케이션 등록하기 KEY 저장하기 데이터베이스 연결 확인하기 전체 데이터 가져오기 - getDocs() 일부 데이터 가져오기 - doc() , getDocs() 조건 검색하기(1) - query() 조건 검색하기(2) - where() 데이터 추가하기 - setDoc() 데이터 수정하기 - updateDoc() 데이터 삭제하기(1) - deleteDoc() 데이터 삭제하기(2) - updateDoc(), deleteField() 01 Firebase란? ❖ Firebase • 구글의 모바일 및 웹 어플리케이션 개발 플랫폼입니다. • 백엔드 서버 기능을 클.. 2022. 12. 13. [REACT] 15. 네트워크 통신 [REACT] 15. 네트워크 통신 Contents 01 동기 vs 비동기 02 async와 await 03 fetch() 함수로데이터 가져오기 01 동기 vs 비동기 ❖ 동기 방식(synchronous) • 요청을 보낸 후 응답을 받아야 다음 동작을 실행할 수 있 는 방식 • 특징 : 설계가 간단하고 직관적 • 요청에 대한 응답을 받을 때까지 대기해야 하는 단점 ❖ 비동기 방식(Asynchronous) • 요청을 보낸 후 응답을 받기 전에 다음 작업을 먼저 실행 하는 방식 • 특징 : 동기 방식보다 복잡함 • 요청에 대한 응답을 받기까지의 대기 시간에 다른 작업을 할 수 있음 👉 자원을 효율적으로 이용할 수 있다. 비동기 : 일해! 나는 다른 일(다른코드 실행중) 하고 있을게! + 기본적으로 fetch.. 2022. 12. 12. 20221212_ Uncaught (in promise) FirebaseError: Missing or insufficient permissions. App.js:15 Uncaught (in promise) FirebaseError: Missing or insufficient permissions. 코딩의 문제가 아니라 해결! ㅂㅁ님 감사합니다😌 2022. 12. 12. 20221212_ Error: Can't resolve 'firebase/app' Failed to compile. Module not found: Error: Can't resolve 'firebase/app' in 'C:\Users\LGE\sessac\lectureNotes\20221212\network\src' ERROR in ./src/firebase.js 3:0-45 Module not found: Error: Can't resolve 'firebase/app' in 'C:\Users\LGE\sessac\lectureNotes\20221212\network\src' ERROR in ./src/firebase.js 4:0-50 Module not found: Error: Can't resolve 'firebase/firestore' in 'C:\Users\LGE\sessac\l.. 2022. 12. 12. HOOKS 6가지정리 [ 1️⃣useState() 2️⃣ useRef() 3️⃣ useEffect() 4️⃣ useMemo() 5️⃣ useCallback() 6️⃣ useReducer() ] HOOKS 6가지정리 1️⃣ useState() - const [state, setState] = useState(초기값) - 값이 변경되면 재렌더링 2️⃣ useRef() const state = useRef(초기값) state => 객체 state.current => 값 저장 - 값이 변경되면 렌더링 x 3️⃣ useEffect() - useEffect(콜백함수, 의존성배열) - 의존성배열 : 옵션 - useEffect(()=>{ 하고 싶은 일 }) : 렌더링 될 때마다 콜백함수 실행 - useEffect(()=>{ 하고 싶은 일 }, []) : 최초에 렌더링(마운트) 되었을 때만 콜백함수 실행 - useEffect(()=>{ 하고 싶은 일 }, [value]) : value 값이 변경되었을 때 콜백.. 2022. 12. 12. 9주차 (22.12.5월~22.12.11일) 프로젝트 고르기 + 1분스피치 준비 + 공부 로 꽉 채운 이번주. https://taehi-dev.tistory.com/135 [1분 스피치] 대본 준비 + 정장대여 + 1분 영상촬영 + 잘먹기 Session 1 _ 대본 잘짜기✨✨✨✨✨ [일정 정리] 새싹 매니저님과의 상담을 토대로 작성한 원고 스크립트. 1차 원고 제출 : [12 04 일] 👉 상담을 토대로 작성, + 1분 스피치 준비 방법 서치 1차 수정 + taehi-dev.tistory.com 2022. 12. 11. React란, React특징, 컴퍼넌트 내 주요 키워드 1) React(리액트)란? - 페이스북사에서 만든 자바스크립트 라이브러리이다. - 페이스북에서 자체적으로 사용하기 위해 만들었고, 많은 웹 어플리케이션에 적용하고 있다. - 유저 인터페이스를 만드는 라이브러리이다. - React(웹 어플리케이션), React Native(모바일 어플리케이션), React Electron(PC 어플리케이션) 2) 리액트의 특징 - 컴퍼넌트로 이루어진 UI 라이브러리 - 컴퍼넌트는 한 가지의 기능을 수행하는 UI 단위를 말한다. - 리액트 어플리케이션은 꼭 하나 이상의 컴퍼넌트로 이루어져 있다. - 최상위 컴퍼넌트는 Root 이다. - virtual DOM tree 를 가지고 있다. 3) 컴퍼넌트 내 주요 키워드 1. state - 데이터의 상태를 나타내는 객체 2. re.. 2022. 12. 9. 6)장바구니 ui 1차시도 fail 2차시도 이해 Comment 받은 사항 ㄴ (Q) 장바구니 만들때 로 해야할지, 로 해야할지, 로 해야할지 고민이 됩니다. (A) 강사님께서 말씀하셨듯, 개발자의 마음이고 선택이긴 하지만 보통 율님께서는 div로 작성을 하신다고 한다. + 이후 table 태그를 css 하려고 하니 , (div)영역을 꾸미는 것보다 (table)을 꾸미는 css 태그가 적어서 그런듯 하다. + 이번에는 table 태그로 레이아웃 을 만들었지만 다음번에는 div로 레이아웃을 짜보도록 하자! 참고사이트 장바구니 코드 참고 HTML의 태그를 이용하여 네이버 장바구니 페이지 만들기 (tistory.com) 폼태그 이해 https://www.nextree.co.kr/p8428/ 과제 : CSS 하기 ( CSS 전.. 2022. 12. 9. [책추천]인터랙티브 웹디자인북 특히 CSS 문법사항이 정리가 잘 되어있고 잘 나와있다. 관련 목차 링크 : HTML5, CSS3, jQuery 필수 구문 정리 2022. 12. 9. 이전 1 ··· 7 8 9 10 11 12 13 ··· 17 다음 728x90 반응형
