profile
주니어 프론트엔드 개발자가 되고 싶은
post-thumbnail

[JS] 백준 11022. A+B

https://www.acmicpc.net/problem/11022이전의 풀었던 문제와 똑같은 풀이법이지만, 출력하는 법이 다른 달랐다. 이전 문제랑 똑같아서 쉽게 문제를 풀 수 있었다.

2022년 6월 22일
·
0개의 댓글
·
post-thumbnail

[React.js] DOM조작하기 - useRef

버튼을 클릭했을 때, 작성자와 일기가 정상적으로 입력되었는지 확인하고 아니라면 focus하기DOM요소를 선택 조작을 도와주는 기능을 가지고 있다.react를 import할때, useRef를 추가하여 import한다.반환값을 상수에 담아 사용한다.이때 상수에는 React

2022년 6월 20일
·
0개의 댓글
·
post-thumbnail

[React.js] 사용자 입력 처리하기

\+input, textarea, select, button으로 이루어진 간단한 입력 장치import {useState} from "react"; 코드 작성해 useState를 쓸 수 있도록 react를 연결시켜준다.각 입력html에 각 state를 이용해 입력갑, 초

2022년 6월 20일
·
0개의 댓글
·
post-thumbnail

[JS] 백준 8393. 합

https://www.acmicpc.net/problem/8393어렵지 않은 문제였다.

2022년 6월 20일
·
0개의 댓글
·
post-thumbnail

[JS] 백준 2739번. 구구단

https://www.acmicpc.net/problem/2739입력 방식이전에는 vscode로 문제를 풀고 제출할 때는 파일경로는 매번 수정했어야 했는데file변수에 조건을 걸어 파일을 수정하지 않고 복붙만 하도록 할 수 있는 방법을 알게 되었다.

2022년 6월 19일
·
0개의 댓글
·
post-thumbnail

[JS] 백준 2480번. 주사위 세개

https://www.acmicpc.net/problem/2480비구조 할당과 스프레드 연산자의 사용Math.max()메소드 사용sort()메소드 : 숫자를 정렬할때 유용한 블로그 글이니 필요할때마다 보고 공부할 것처음 문제를 접할때는 식을 어떻게 써야하나 고

2022년 6월 19일
·
0개의 댓글
·
post-thumbnail

[React.js] State 상태

계속해서 변화하는 특정 상태상태에 따라 각각 다른 동작을 함State를 만들기 위해서 State가 필요한 컴포넌트 파일에 React를 import해야 한다.useState메서드는 배열을 반환하고, count와 setCount를 반환한다.count는 상태의 값으로 사용된

2022년 6월 16일
·
0개의 댓글
·
post-thumbnail

[React.js] css적용 & JSX문법

css파일을 export를 따로 하지 않는다.class, id명은 html파일에 적용하듯이 사용할 수 있다.App()함수의 return 값의 html구조안에 class와 id값을 지정해 주룻 있다.html에서의 class는 JSX문법에서는 className이므로 주의A

2022년 6월 16일
·
0개의 댓글
·
post-thumbnail

[React.js] 리액트 파일 생성 & 컴포넌트 만들기

npx create-react-app 파일명src파일 내에 js파일을 만든다.파일내 함수내에 원하는 것을 만들어 변수에 저장한다.파일을 밖으로 내보내려면 export default 함수명내보낸 컴포넌트를 넣고 싶은 파일에 불러올려면 import 이름 from 경로MyH

2022년 6월 16일
·
0개의 댓글
·
post-thumbnail

[React.js] React.js가 필요한 이유

중복 코드로 인해서 중복코드의 변경상항에 의해서 중복코드가 포함된 페이지를 하나 하나 수정해야하는 상황한 개의 문제가 수많은 파일을 수정해야 한다.즉, 유지보수에 큰 문제가 된다.중복될 것 같은 부분은 별도의 파일로 제작하거나, 모듈로 만들어 컴포넌트를 만들어 코드를

2022년 6월 16일
·
0개의 댓글
·
post-thumbnail

[Node.js] Node.js 기초

자바스크립트를 브라우저가 아닌 어느 곳에서 실행 할 수 있게 해준다.자바스크립트 실행환경Javascript's Runtime 이라고 한다.https://nodejs.org/ko/따라서, Node.js를 이용하면 브라우저 없이 자바스크립트는 컴퓨터에서 실행 할

2022년 6월 16일
·
0개의 댓글
·
post-thumbnail

[JS] API & fetch

client와 server간에 상호작용을 하는 것으로 데이터 요청(Request)와 요청 데이터를 전달(Response)의 과정을 말한다.client와 server가 대화를 하는 방법즉, 다른 프로그램에게 말을 거는 것과 비유할 수 있다.API 호출은 데이터를 반환받기

2022년 6월 15일
·
0개의 댓글
·
post-thumbnail

[JS] async & await - 직관적인 비 동기 처리 코드 작성하기

async 키워드는 함수에 붙여 Promise를 반환하는 기능을 가진다.비동기를 다루는 기능이자, promise를 더 쉽게 쓸수 있다.async를 함수 앞에 붙여주면, 자동적으로 함수는 Promise를 리턴하게 되는 함수가 되어 비동기 처리 함수가 된다.그렇다면, as

2022년 6월 15일
·
0개의 댓글
·
post-thumbnail

[JS] Promise - 콜백 지옥 탈출

연속되는 비동기 함수를 처리할때, 비동기 처리의 결과 값을 사용하기 위해서코드가 깊어지는 현상자바스크립트의 비동기를 도와주는 객체비동기 처리의 결과값을 핸들링 하는 코드를 비동기 함수로부터 분리할 수있다.Promise객체를 사용하면 비동기 처리의 콜백함수를 줄지어 사용

2022년 6월 15일
·
0개의 댓글
·
post-thumbnail

[JS] 동기 & 비동기 & 콜백함수

<자바스크립트의 싱글 스레드(Thread) 작업 수행방식>으로 진행된다.블로킹 방식 : 스레드가 작업하고 있을때 다른 작업을 동시에 할 수 없는 방식자바스크립트는 코드가 작성된 순서대로 작업을 처리함이전 작업이 진행중일 때는 다음 작업을 수행하지 않고 기다림먼저

2022년 6월 15일
·
0개의 댓글
·
post-thumbnail

[JS] Spread 연산자

배열과 객체를 한줄로 펼치는 방법중복된 프로퍼티를 사용하게 되는 경우이다.이러한 경우에는 spread연산자를 이용할 수 있다.배열의 원소를 순서대로 펼칠 수 있다.

2022년 6월 15일
·
0개의 댓글
·
post-thumbnail

[JS] 비 구조화 할당(구조 분해 할당)

배열, 객체에서 원하는 값을 쉽고 빠르게 구할 수 있는 방법따라서 변수명이 키값으로 강제되는 경우가 있다.즉 비구조화 할당할때 :을 이용해 다른 변수명을 지정해 주면 된다.

2022년 6월 15일
·
0개의 댓글
·
post-thumbnail

[JS] 조건문 업그레이드

입력한 파라미터가 한식인지 아닌지 구별하는 프로그램을 조건식을 이용해 만들어보자여기서 조건식이 너무 길고, 연산자를 중복으로 사용하고 있다.이 프로그램을 배열에 담고 includes메서드를 이용해 작동하도록 수정한다.여러가지 조건을 가지고 있는다면 if문을 여러개 쓸

2022년 6월 15일
·
0개의 댓글
·
post-thumbnail

[JS] 단락 회로 평가

논리 연산자의 특성(오른쪽에서 왼쪽으로 흐르면서 계산하는)을 이용한 문법이다.

2022년 6월 15일
·
0개의 댓글
·
post-thumbnail

[JS] 삼항 연산자

a 변수가 양수인지 아닌지 판별하는 조건식을 if문으로 작성했을 경우, 간단한 작동이지만 코드의 길이가 길다.삼항연산자를 이용하면 한줄로 조건식을 작성할 수 있다.중첩 삼항 연산자는 가독성이 떨어진다.따라서 중첩으로 사용할때에는 if조건문을 이용해 가독성을 높여주는 것

2022년 6월 15일
·
0개의 댓글
·