Front-End, CS 스터디38 [리액트 React] 심화 학습 자료 정리 🔹 Redux-Toolkit-Todolist 최종 완료 깃헙 주소 : https://github.com/jennywoon/Redux-Toolkit-Todolist.git ✅ Redux Toolkit 1️⃣ 리덕스툴킷이란? 👌 리덕스툴킷 리덕스툴킷은 이전에 배운 리덕스를 개량한 것으로 생각하면 된다. 리덕스럴 사용하기 위해 작성했던 duck 패턴의 요소들이 전체적인 코드의 양을 늘린다는 개발자들의 불만이 발생하기 시작했고 리덕스 팀에서는 이것을 수용하여 코드는 더 적게, 그리고 리덕스를 더 편하게 쓰기 위한 기능들을 흡수해서 만든 것이 리덕스 툴킷이다. 줄여서 RTK 라고도 한다. 👌 새로운 것이 아니다 리덕스 툴킷은 배웠던 리덕스의 구조나 패러다임이 모두 똑같다. 즉, 새로운 것이 아니다. 리덕스의 전체.. 2022. 8. 5. [리액트 React] 심화반 강의 1주차 정리 ✅ Javascript Re-start! (1) - 기본 1️⃣ 변수와 상수 🔹 변수 생성의 3단계 ▶️ 선언 -> 초기화 -> 할당 - 선언 : 실행 컨텍스트에 변수 객체를 등록(스코프가 참조하는 대상이 되도록) - 초기화 : 변수 객체에 등록된 변수를 위헤 메모리에 공간을 확보(여기서 변수는 보통 undefined로 초기화) - 할당 : undefined로 초기화된 변수에 실제 값을 할당 👌 var var는 가급적 사용하지 않는 것이 좋다. - var로 선언한 변수는 블록 스코프가 아니라 함수 수준 스코프를 가진다. - var는 선언과 초기화를 한번에 한다. - 재선언이 가능하다. - 선언하기 전에도 사용할 수 있다. // var는 이런 식의 사용도 가능하다. // var name은 선언! name .. 2022. 8. 4. [리액트 React] 기초반 강의 5주차 정리 🔹 내 Git Hub 주소 : https://github.com/jennywoon/bucket_list 완료한 Git Hub 주소 올려놓았다. css 중간에 수정하지 않은 것들이 있어 색이나 디자인은 완벽하지 않지만 기능 구현을 해두었다. ✅ 리덕스에서 FireStore 데이터 가지고 놀기 👌 firestore 데이터를 리덕스 스토어에 넣으려면 : 미들웨어 설치! firestore에서 데이터를 가져올 때 비동기 통신을 한다. 리덕스에서 비동기 통신을 할 때 필요한 것은 미들웨어! 🔹 미들웨어란? 리덕스 데이터를 수정 : 액션이 디스패치 -> 리듀서에서 처리 미들웨어는 이 과정 사이에 미리 사전 작업을 할 수 있도록 하는 중간 다리이다. 미들웨어 : 액션이 일어나고 -> 미들웨어가 할 일 하기 -> 리듀서.. 2022. 8. 3. [도서] 1일 1로그 100일 완성 IT지식 #소프트웨어(18~26, 34~35) ✅ 소프트웨어 18번 : 알고리즘과 초콜릿 케이크 레시피 👌 소프트웨어란? 컴퓨터가 무언가 유용한 일을 하게 해주는 일련의 명령어 집합의 모임. 컴퓨터 소프트웨어는 컴퓨터 하드웨어의 반애 의미로, 컴퓨터 하드웨어는 해당 일을 실제로 수행하는 시스템이다. 쉽게 설명하자면 생명체를 하드웨어라고 가정한다면 그를 구성하는 유전자가 소프트웨어라고 생각할 수 있다. 👌 알고리즘이란? 수학과 컴퓨터 과학, 언어학 또는 엮인 분야에서 어떠한 문제를 해결하기 위해 정해진 일련의 절차이다. 계산을 실행하기 위한 단계적 절차를 의미하기도 한다. 즉, 문제 풀이에 필요한 계산 절차 또는 처리 과정의 순서를 뜻한다. 👌 알고리즘의 조건 🔹 입력(Input) : 알고리즘 수행에 필요한 자료가 외부에서 제공되어야 한다. 🔹 출력(.. 2022. 7. 30. [리액트 React] 숙련 학습 자료 정리 ✅ 컴포넌트 꾸미기(CSS-in-JS) 1️⃣ CSS-in-JS란? 단어 그대로 자바스크립트 코드로 CSS 코드를 작성하여 컴포넌트를 꾸미는 방식 새로운 패키지를 사용한다. 2️⃣ styled-components란? 리액트에서 CSS-in-JS 방식으로 컴포넌트를 꾸밀 수 있게 도와주는 패키지 👌 yarn add styled-components 👌 기본적인 사용법 SC의 기본적인 원리는 꾸미고자 하는 컴포넌트를 SC의 방식대로 먼저 만들고 그 안에 스타일 코드를 작성하는 방식으로 진행된다. * App.js import React from "react"; // styled-components에서 styled 라는 키워드를 import 한다. import styled from "styled-component.. 2022. 7. 29. [생활코딩] 입문자를 위한 자바스크립트 기초 강의 #자바스크립트 소개 # 자바스크립트 기초 초반 기초 내용은 사실 아는 내용들이지만, 천천히 정리해가면서 개념을 다져가고자 정리를 시작하려고 한다! 꾸준히 매일매일 공부하기👌 ✅ 자바스크립트란 - 자바스크립트는 프로그래밍 언어이다. - 자바스크립트는 주로 웹(웹사이트) 개발을 위해 사용한다. - 브라우저가 가진 기능을 실행 시키거나, 웹 페이지의 내용을 조작할 수 있다. ✅ 객체란 무엇일까 - 객체는 자바스크립트의 핵심 개념으로, 값 또는 기능을 가지고 있는 데이터이다. - 사용자는 자바스크립트 코드를 이용해 웹브라우저 객체에 접근할 수 있다. - 객체 뒤에 점을 찍으면, 객체가 가진 데이터가 기능을 사용할 수 있다. - 객체가 가진 기능을 '메소드'라고 한다. - 자바스크립트 문법에도 주석이 있다. 두 가지 방법으로 주석을 만들 수 있다 (//.. 2022. 7. 28. 이전 1 2 3 4 5 6 7 다음