JavaScript는 비동기적인 작업을 처리하기 위해 await와 async라는 키워드를 제공합니다. 이들은 JavaScript 개발자들이 비동기 코드를 더 읽기 쉽고 관리하기 쉽게 작성할 수 있게 해주는 강력한 기능입니다. 이 글에서는 await와 async의 개념과

Lifecycle은 주로 리액트에서 생성한 컴포넌트에 사용하는 개념입니다.컴포넌트 또한 인생이 있다라는 생각으로 가볍게 이해하시면 좋을거 같습니다.컴포넌트 3가지 lifecycle개념을 가지고 있는데 다음과 같습니다이러한 컴포넌트의 lifecycle 개념을 익히는 이유

리액트의 컴포넌트가 늘어나면서 각각의 스타일링을 하게 되면 여러 상황들이 생깁니다.이러한 상황들을 방지하기 위해서 styled-component를 이용하여 스타일을 바로 입힐 수 있습니다.터미널에 라이브러리 설치하는 명령을 입력합니다.설치 후 사용할 컴포넌트에 impo

nested-routes 문법은 특정 웹페이지에서 서브경로를 제작할시 주로 사용합니다또한 여려개의 유사한 페이지를 작성할때 사용되는 문법입니다.서브경로를 제작하기전에 location으로 이동하는 Route 코드를 만들겠습니다URL 주소에 /company 입력할시 div

useNavigate 컴포넌트는 router-dom 라이브러리에서 지원하는 컴포넌트로 Link의 컴포넌트와다르게 함수형을 선언하여 페이지 이동 기능을 구현할때 자주 사용하는 기능입니다.사용을 위해 react-app에서필요한 컴포넌트를 우선 import 시킨 후 시작합니

리액트에서 각 페이지를 나누는 기능을 구현할때 사용하는 라이브러리인 router-dom을 배워보겠습니다. 기존 방식(html, css, js)이라면 html 파일 여러개를 제작하여 이용하지만 리액트에서는 html파일을 하나만 사용합니다. router 설치 방식 VS

JavaScript의 반복문은 프로그램에서 동일한 작업을 여러 번 반복하여 수행하는 데에 사용됩니다. 이를 통해 반복적인 작업을 자동화하고, 코드의 중복을 피하며, 데이터를 효율적으로 처리할 수 있습니다. JavaScript에서는 주로 for문과 while문이 가장 많

JavaScript에서 조건문은 프로그램의 흐름을 제어하고, 다양한 상황에 따라 코드를 실행할 수 있게 해줍니다. 두 가지 주요한 조건문인 if문과 switch문은 프로그래밍에서 자주 사용되는 도구로, 각각 다른 상황에 적합하게 사용됩니다.이 글에서는 if문과 swit

자바스크립트는 Array 객체에 다양한 함수를 제공하여 배열 데이터를 조작하고 처리하는 데 도움을 줍니다. 이 글에서는 자바스크립트의 주요 Array 함수들에 대해 설명하고, 각 함수의 예시 코드와 실행 방법에 대해 알아보겠습니다.push() 함수는 배열의 끝에 하나

리액트에서 컴포넌트를 제작시 function을 이용해 컴포넌트를 제작하지만 class 문법을 사용해서도 컴포넌트를 만들 수 있습니다. 예시 코드를 이용해 만들어 보겠습니다 이후에 테스트 컴포넌트를 이용할때마다 div값에 안녕이 저장되어 출력이 됩니다.

자바스크립트에서 변수를 선언하는 방식에는 var, let, const 세 가지가 있습니다. 이들의 차이점을 이해하고 올바른 변수 선언 방식을 선택하는 것은 자바스크립트 개발에서 중요한 부분입니다. 이 글에서는 var, let, const의 차이점과 let을 더 많이 사

자바스크립트는 동적 타입 언어로, 변수의 타입을 선언하지 않고도 값을 할당할 수 있습니다. 이러한 특성 때문에 자바스크립트의 데이터 타입을 이해하는 것은 중요합니다. 이 글에서는 자바스크립트의 기본 타입과 참조 타입에 대해 알아보겠습니다. 또한, 각각의 예시 코드를 통

Input 태그 사용하기 input 태그를 응용하기 이전에 사용한 태그 설명입니다 글자를 작성할 수 있는 칸을 생성하는 태그 길이를 조절 할 수 있는 칸을 생성하는 태그 연, 월, 일 등 달력을 생성하는 태그 숫자를 생성하고 올리고, 줄일 수 있게 생성하는

자바스크립에서는 다른 함수에 있는 변수를 마음대로 가져다 쓸 수 없습니다 그러나 컴포넌트 2개가 부모 / 자식 관계인 경우에 가능합니다(다른 컴포넌트 안에 있는 컴포넌트를 자식 컴포넌트라고 부릅니다)부모 컴포넌트의 state를 자식 컴포넌트로 전송할 수 있으며 자식도

array의 갯수(3개)만큼 1을 3번 출력하는 결과를 얻게 됩니다.chrome 개발자도구(F12)콘솔에서 입력시 결과를 확인할 수 있습니다.array의 안에 있는 값인 2,3,4가 출력되는 모습입니다.let array = 2,3,4let newArray = arra

자바스크립트에서 함수는 코드의 재사용을 위해 사용되는 중요한 개념입니다. 함수는 특정 작업을 수행하고 값을 반환할 수 있습니다.함수를 선언하는 방법은 다음과 같습니다:javascriptCopy codefunction functionName(parameter1, para

기초적인 레이아웃과 CSS를 적용하여 제작했습니다!기존 자바스크립트의 방식처럼 let = 변수명 식으로 데이터를 저장할 수 있으나,리액트에서는 변수가 아닌 state를 만들어서 데이터 저장이 가능합니다.let 글제목, b = useState('남자 코트 추천');이런식

평소 사용하던 html, css와 다르게 스타일을 주기 위한 class명을 넣을때class = " "가 아닌 className = " "을 사용하여 작성합니다.(위에 적용했던 css와 같이 적용하여 실행할시)자바스크립트의 변수선언 방식 var, let, const키워드