본문 바로가기

분류 전체보기162

비동기 시리즈 - Promise 자료 정리 * CAPTAIN PANGYO 자료 출처 하단 기재, 좋은 자료가 많아서 들어가서 둘러보는 것을 추천한다! ✅ 자바스크립트 Promise 쉽게 이해하기 1️⃣ Promise란? "A Promise is an object that may produce a single value some time in the future" 프로미스는 자바스크립트 비동기 처리에 사용되는 객체이다. 여기서 자바스크립트의 비동기 처리란 "특정 코드의 실행이 완료될 때까지 기다리지 않고 다음 코드를 먼저 수행하는 자바스크립트의 특성"을 의미한다. 2️⃣ Promise가 왜 필요할까? 프로미스는 주로 서버에서 받아온 데이터를 화면에 표시할 때 사용한다. 일반적으로 웹 애플리케이션을 구현할 때 서버에서 데이터를 요청하고 받아오기 위해.. 2022. 8. 5.
비동기 시리즈 - 비동기 개념 및 콜백함수 자료 정리 * CAPTAIN PANGYO 자료 출처 하단 기재, 좋은 자료가 많아서 들어가서 둘러보는 것을 추천한다! ✅ 비동기 개념 및 콜백함수 "Promise는 자바스크립트 비동기 처리에 사용되는 객체" 1️⃣ 비동기 처리 자바스크립트의 비동기 처리란, 특정 코드의 연산이 끝날 때까지 코드의 실행을 멈추지 않고 다음 코드를 먼저 실행하는 자바스크립트의 특성을 의미한다. 2️⃣ 비동기 처리의 첫 번째 사례 비동기 처리의 가장 흔한 사례는 제이쿼리의 ajax이다. 제이쿼리로 실제 웹 서비스를 개발할 때, ajax 통신을 빼놓을 수 없다. 보통 화면에 표시할 이미지나 데이터를 서버에서 불러와 표시해야 하는데 이때 ajax 통신으로 해당 데이터를 서버로부터 가져올 수 있기 때문이다. function getData() .. 2022. 8. 5.
HTTP 프로토콜 Part 1 자료 정리 * CAPTAIN PANGYO 자료 출처 하단 기재, 좋은 자료가 많아서 들어가서 둘러보는 것을 추천한다! ✅ HTTP 프로토콜 1️⃣ HTTP 프로토콜이란? HTTP(Hypertext Transfer Protocol)는 웹을 개발하는 사람이라면 누구나 다 알아야 하는 통신 프로토콜이다. 프로토콜이란 상호 간에 정의한 규칙을 의미하며 특정 기기 간에 데이터를 주고받기 위해 정의되었다. 통신 프로토콜을 쉽게 풀어보면 "나는 이렇게 줄 테니 넌 이렇게 받고 난 너가 준거 그렇게 받을게" 정도가 된다. 웹에서는 브라우저와 서버 간에 데이터를 주고받기 위한 방식으로 HTTP 프로토콜을 사용하고 있으며 프런트엔드 필수적으로 알아야 하는 지식이다. 2️⃣ HTTP 프로토콜 특징 HTTP 프로토콜은 상태가 없는(st.. 2022. 8. 5.
[리액트 React] 심화 학습 자료 정리 🔹 Redux-Toolkit-Todolist 최종 완료 깃헙 주소 : https://github.com/jennywoon/Redux-Toolkit-Todolist.git ✅ Redux Toolkit 1️⃣ 리덕스툴킷이란? 👌 리덕스툴킷 리덕스툴킷은 이전에 배운 리덕스를 개량한 것으로 생각하면 된다. 리덕스럴 사용하기 위해 작성했던 duck 패턴의 요소들이 전체적인 코드의 양을 늘린다는 개발자들의 불만이 발생하기 시작했고 리덕스 팀에서는 이것을 수용하여 코드는 더 적게, 그리고 리덕스를 더 편하게 쓰기 위한 기능들을 흡수해서 만든 것이 리덕스 툴킷이다. 줄여서 RTK 라고도 한다. 👌 새로운 것이 아니다 리덕스 툴킷은 배웠던 리덕스의 구조나 패러다임이 모두 똑같다. 즉, 새로운 것이 아니다. 리덕스의 전체.. 2022. 8. 5.
항해99 26일차 TIL - (리액트) 투두리스트 심화 과제 와이어프레임 설정 & 오늘 배운 것 ✅ 와이어프레임 구성 세 번째 진행하는,,, 그리고 심화 주차인 투두리스트의 와이어 프레임을 구성했다! 기능만 봐도 너무 많아서 페이지를 여러 개 구성해야 하는데,, 할 수 있다..ㅠㅠ 일단 오늘은 심화 학습자료 공부를 시작했는데 컨디션이 너무 좋지 않다. 아픈 것은 아닌데 졸림을 아예 참을 수 없는 정도인 것 같다 오늘은 일찍 자고 내일 잘 해보기!! 컨디션 관리 중요해 ㅠㅠ ✅ 오늘 배운 것 1️⃣ 리액트 심화자료 공부 : 리덕스 툴킷 ~ jason server 지금 너무 피곤해서 그런지 다른 팀원들에 비해 속도가 느렸다. 그래도 놓치는 부분 없이 집중해서 진행하자! 🔹 내 블로그 정리해둔 곳 : https://jenny0520.tistory.com/84 2️⃣ 자바스크립트 🔹 내 블로그 정리해둔 곳.. 2022. 8. 5.
항해99 25일차 TIL - (리액트) 투두리스트 기능 업데이트 & 오늘 배운 것 🔹 최종 Git Hub 주소 : https://github.com/jennywoon/Final-todolist.git ✅ 두 번째 React Todo List 최종 완료! 항해에서 과제로 내 준 기능을 모두 구현하고 styled-component를 수정하면서, 기술매니저님께서 기능 업데이트를 해보라고 해서 2조 팀원들과 기능을 업데이트 해보았다! 업데이트는 총 6가지 이다. 1️⃣ Detail 페이지에 Layout을 연결하여 위에 Header 모양까지 보여주었다. 2️⃣ Header 상단에 머티리얼 UI 로 추가하였다. 3️⃣ 상세페이지에서 머티리얼 UI 버튼을 누르면 홈으로 돌아갈 수 있도록 기능 구현 4️⃣ ID 값 오류 수정 원래는 const nexiId = useRef(0) id : nextId .. 2022. 8. 4.

티스토리툴바