본문 바로가기

전체 글148

[항해99] 5주차 WIL [Axios] 🧸 이번 5주차 WIL 키워드 ! ☑️ Axios 🧸 axios는 HTTP 비동기 통신 라이브러리이다. (Axios docs) 🧸 특징 브라우저에서 XMLHttpRequests 만들기 node.js에서 http 요청 만들기 Promise API 지원 요청 및 응답 가로채기 요청 및 응답 데이터 변환 취소 요청 JSON 데이터에 대한 자동 변환 XSRF 로부터 보호하기 위한 클라이언트 측 지원 설치 Using npm: $ npm install axios Using bower: $ bower install axios Using yarn: $ yarn add axios Using jsDelivr CDN: Using unpkg CDN: axios 자세한 사용법 음 사용법을 봐도 잘 모르겠다. 실제로 내가 써보고.. 2022. 4. 10.
[항해99 34일차] 2022.04.09 TIL / (로그인 회원가입 유저 모듈) 📔 오늘 할 일 📔 1. 레이아웃 완성 2. 로그인 회원가입 리덕스 모듈 만들기 🤔 해결한 문제 🤔 딱히..레이아웃을 잡는데에는 문제를 겪은게 없다.. 아마도 데이터를 주고 받으면서 에러가 뜨지 않을까 ㅎㅎ 😊 주절주저리 😊 드디어 레이아웃을 완성했다. 하하ㅠㅠ 힘들었다...컴포넌트는 그냥 내 마음대로 쪼개버렸당~! 이제 로그인 회원가입은 백엔드 분들한테 데이터 받는 것만 하면 끝날 듯 하다!!! 오예에.. 댓글 작성,,삭제 수정이 문제일거같지만. 잘 할 수 있겠지!? ㅠㅠ너무 오래 공부하니까 머리가 아파왔다.. 무릎도 아프구... 📚부족한 부분📚 axios쓰는 방법.. 아예감이 안온다.. 어떻게 데이터가 들어오는지 모르겠지만..!!!! 받아보면 알 수 있을것도 같다. ㅎㅎ ✅ 월요일 할 일 ✅ 1. 백.. 2022. 4. 9.
[항해99 33일차] 2022.04.08 TIL / (6주차 미니프로젝트 시작) 📔 오늘 할 일 📔 1. 와이어프레임 만들기 2. API 설계 📖 오늘 배운 개념 📖 🤩 요청을 보낼 땐? 미리 약속한 주소로 (url) 어떤 요청을 보낸다. (type) 필요하다면 서버가 일하기 위해 필요한 자료와 (data) 누가 요청했는 지 알려주면 된다. 🤩 Axios axios는 HTTP 비동기 통신 라이브러리이다. (Axios docs) yarn add axios export const authApi = { // e.g) 회원 가입 signup: someData => instance.post("api/user", { someData: someData, someOtherData: someOtherData }), // e.g) 유저 프로필 변경 editUserProfile: (someData) =.. 2022. 4. 8.
[항해99 32일차] 2022.04.07 TIL / (파이어베이스 9버전 스토리지에 이미지 업로드 하기!!!!) 📔 오늘 할 일 📔 1. 다시 복습 (게시글 가져오는 부분이랑 나머지들 ...) 2. 모던 자바스크립트 읽고 포스팅하기 3. 알고리즘 문제 풀기 4. code책 읽기 📖 오늘 배운 개념 📖 강의는 파이어베이스 8버전으로 알려주지만, 난 파이어베이스 9버전으로 해보겠다!! 우선 업로드 컴포넌트를 만들어준다. 🧸 Upload.js 더보기 import React from "react"; const Upload = (props) => { const selectFile =(e)=>{ console.log(e, "나는 e") console.log(e.target, "나는 e.target") console.log(e.target.files, "나는 e.target.files") } return ( ) } export.. 2022. 4. 7.
[항해99 31일차] 2022.04.06 TIL /SEO 📔 오늘 할 일 📔 1. 강의 다듣기 2. 알고리즘 문제 풀기 3. 다시 처음부터 복습하기 4. 모던 자바스크립트 책 읽기 5. 과제 배포 📖 오늘 배운 개념 📖 SEO(Search Engin Optimization: 검색엔진최적화) 네이버나 구글같은 검색 엔진에 뭔가를 검색했을 때, 내가 만든 사이트가 검색 결과에 더 잘 보이게 하기 위한 과정 👉 검색을 하면, 검색 엔진이 내 사이트 내용물(메타 태그, html 내용 ...)을 한 번 훑어가고(크롤링), 내용물에 특정한 인덱스 같은 걸 만듦. 그리고 이 인덱스 같은걸 검색 결과에 보여줌. 검색 엔진 최적화는 검색 엔진이 내 사이트를 크롤링할 때 정보를 더 잘 가져갈 수 있도록 도와주는 과정 React에서 검색엔진 최적화를 하려면? meta-data 넣.. 2022. 4. 7.
[항해99 30일차] 2022.04.05 TIL /무한 스크롤 알림기능 1. 4주차 강의 다 듣기 난이도 급상승으로 .. 강의내용을 그대로 따라해도 막 오류나고 그런다.ㅠㅠ 흑흑 무한 스크롤 만들 준비 post.js 덕스구조에 아래 내용을 추가해준다. //액션타입 const LOADING ="LOADING"; //액션 생성 const setPost =createAction(SET_POST,(post_list, paging)=>({post_list,paging})); const loading =createAction(LOADING,(is_loading)=>({is_loading})); //초기값 const initialState ={ list: [], paging: {start: null, next: null, size: 3}, is_loading: false, }; //리듀.. 2022. 4. 6.