# 코드잇

franzsomm

switch문let myChoice = 2; // 변수 설정switch(mychoice) { //switch 함수, 파라미터 대입 case 1: // :으로 마무리할 것. console.log('토끼를 선택한 당신,...'); // 출력코드 break; // c

william741

총 7개로 이루어져 있습니다.AND = A,B 모두 TRUE일 때OR = A, B 중 하나라도 TRUE일 때NOT = A가 TRUE면 FALSENAND = A,B 모두 TRUE면 FALSE, AND의 반대NOR = A, B 중 하나라도 TRUE면 FALSE, OR의 반

fullmoon29

① 리액트에서 입력폼 만들기 ② 제어컴포넌트와 비제어컴포넌트 ③ File input ④ ref로 DOM노드 가져오기 ⑤ 이미지 파일 미리보기 ⑥ 사이드 이펙트 (Side Effect) ⑦ 별점 컴포넌트 만들기

cosmicsandbox

문장을 구분하는 방법으로 세미콜론을 사용한다.세미콜론이 없어도 잘 동작하긴 함. (그냥 엔터를 쳐서 문장을 구분하면)한 줄에 한 문장씩 작성하면 자동으로 세미콜론 추가해주는 기능을 가지고 있음.그냥필요한 경우에만 사용하자 vs 문장 끝에 반드시 사용하자이런 두가지 파가

savazy_gg

엘리스에서 부트캠프 커리큘럼을 진행하고 있지만, 약3-4달간 html, css, javascript, typescripy, node.js, express, mongodb, react, redux, style componets를 압축으로 배우고 있기 때문에(아마 공부해본

fullmoon29

1. 배열 렌더링하기 ① mock 데이터 ② map ③ sort ④ filter 2. 서버에서 데이터 가져오기① fetch ② useEffect ③ pagination ④ 조건부렌더링 ⑤ 비동기로 state 변경시 주의점 ⑥ useState 정리 ⑦ 네트워크 로딩

iberis

파일 객체를 ObjectURL로 만들면 파일에 대한 주소를 만들 수 있다. 이렇게 만들어진 파일 주소는, 사용자 컴퓨터에 있는 파일을 (인터넷에 올린 파일 링크와 같이) 사용할 수 있도록 한다. ObjectURL을 만들면 웹 브라우저는 메모리를 할당하고 파일에 해당하는

fullmoon29

오늘도 코드잇_ 학습일기_ React 기초 정리

iberis

<input>의 value 를 리액트에서 지정함!codesandboxnostalgic-silence-8uw3wg?fontsize=14&hidenavigation=1&theme=light리액트에서 사용하는 값과 실제 <input>의 값이 항상 일치한다.동작을

iberis

title, calorie, content 3가지 입력 input을 받아서 상태관리를 하려면 3가지 useState를 만들고 상태를 관리하게 된다. 3가지 속성에 대해 한 번에 제출되는 이벤트를 만들고 싶을 때,이벤트 객체의 event.target.value 와 eve

iberis

각 페이지에 들어갔을 때 페이지 제목<title>을 바꿔주는 라이브러리이다.🔗 npm 공식 홈페이지 : react-helmet터미널에서 설치 후 원하는 페이지에서 import 하여 사용하면 된다.<Helmet><title> 변경할 타이틀 </ti

iberis

사용자가 클릭해서 페이지를 이동하도록 할 때 사용대부분의 경우 Link 만으로도 충분하다.하이퍼링크 텍스트 페이지를 이동하는 버튼이미지 등특정 경로에서 렌더링 시점에 다른 페이지로 이동시키고 싶을 때 사용쇼핑몰의 회원 전용 페이지에 로그인없이 들어와서 로그인 페이지로

iberis

URL(Uniform Resource Locator) 웹에 존재하는 특정 데이터를 나타내는 문자열https://www.shoping.com/men/shirts?color=blue&size=mHost : 전 세계 서버 중 하나의 서버를 특정www.shoping.

iberis

/courses 의 하위 페이지로 /courses/react-frontend-development 등 여러 페이지가 있을 때 해당 페이지들을 따로 묶어줄 수 있다.<Route path ="courses"> </Route> 사이에 관련 페이지를 모두 넣고,기준

iberis

ReactRouter 리액트 컴포넌트로 페이지를 나누는 라이브러리 핵심 컴포넌트 : Router, Routes, Route, Link Router 리액트 라우터에서 사용하는 모든 데이터들(현재주소, 페이지 기록 등)을 가지고 있다. 라우터에서 제공하는 기능을 사용하

kmjstj3

async는 asynchronous의 줄임말로 비동기를 의미한다. 그래서 함수앞에 async라는 키워드가 있다면 이 함수는 비동기적으로 실행 할 부분이 있다는 것을 나타낸다. await은 promise객체를 리턴하는 코드 앞에 있는데 await은 '기다리다'라는

kmjstj3

초창기 웹은 특정 웹 페이지에서 다른 웹 페이지로 갈 수 있는 하이퍼링크를 클릭하면 새로운 웹 페이지가 로드 되는 방식이였다. 물론 이러한 방식은 현재도 사용하기 한다. 하지만 매번 이런식으로 새로운 웹이 로드 되는 방식은 특정 부분만 새로 보여지거나 없어지면 될 것

j10501

마우스 이벤트mousedown : 마우스 버튼을 누르는 순간mouseup : 마우스 버튼을 눌렀다 떼는 순간click : 왼쪽 버튼을 클릭한 순간dblclick : 왼쪽 버튼을 빠르게 두 번 클릭한 순간contextmenu : 오른쪽 버튼을 클릭한 순간mousemove

kmjstj3

이때까지 우리는 항상 fetch메소드를 써서 promise객체를 생성했다. 하지만 fetch메소드를 쓰지 않고 promise객체를 생성할 수 있다. 🧩promise객체 만들기 우선 new생성자 함수를 통해 promise객체를 만들 수 있는데 사진을 보면 콜백함수

kmjstj3

비동기(1) 글에서 error를 다루는 법까지 적었는데 이번에는 그 error를 조금더 잘 다루기 위한 방법을 소개할까 한다. 실무에는 보통 error를 다루기 위해 쓰는 메소드로 catch메소를 쓴다고한다. catch메소드라고 then메소드와 다를 것은 없다.