리액트_5

jsx에선 if 대신 삼항연산자 또는 논리 연산자를 사용한다.코드가 너무 길어지면 render 바깥 함수로 빼는 것도 방법.jsx 조건문에서 false, undefined, null은 코드 없음을 의미한다.useRef는 Dom에 접근할 때 말고도 값이 바뀌지만 화면에

2022년 10월 17일
·
0개의 댓글
·

리액트_4

import : JS의 ES6 문법으로 다른 패키지 안에 있는 클래스, 메소드, 변수 등의 데이터를 사용하고자 할 때 쓰는 키워드모듈 관리 전용 키워드(import,from,export,default)를 사용require을 import로 바꾸기

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

리액트_3

node, npm 설치package.json 생성, (npm init)리액트, 리액트 돔 설치 (npm i react react-dom)웹팩 설치 (npm i -D webpack webpack-cli) package.json실제 서비스에 쓰이는 것들 -> depende

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

리액트_2

리액트는 자바스크립트다.리액트는 데이터 중심으로 움직인다.컴포넌트: 데이터와 화면을 하나로 묶어주는 덩어리데이터: state화면 : render의 return부분배포시에는 아래와 같이 배포용을 사용해야하지만 사실 이 방법을 실무에서 쓸 일은 없다.

2022년 10월 14일
·
0개의 댓글
·

리액트_1

제로초님 강의 듣고 공부 https://youtu.be/aYwSrzeyUOk 리액트를 왜 쓰는가? : 과거보다 한 페이지에 해당하는 용량이 매우 늘어났고 매번 새로운 페이지를 전달하는 게 버거워졌다. 그래서 등장한 것이 SPA(Single Page Application

2022년 10월 14일
·
0개의 댓글
·

[JS] 틱택토 게임

틱택토 게임, 이차원 배열

2022년 10월 1일
·
0개의 댓글
·

[JS] 반응속도 테스트

반응속도 만들기. Date객체,

2022년 10월 1일
·
0개의 댓글
·

[JS] 가위바위보

가위바위보 게임, 객체리터럴, setInterval강의 : https://youtu.be/5aIQ7EAfosc0.05초마다 computerChoice의 가위바위보 값을 바꾸고 그 값을 화면에 표시객체 값을 가져올 때 주의할 점setInterval은 setTim

2022년 9월 30일
·
0개의 댓글
·
post-thumbnail

[JS] 로또 추첨

1~45까지의 숫자 중에 7개를 뽑아서 1초마다 보여줌.피셔예이츠 셔플, 비동기, 스코프/클로저github: https://github.com/raquim47/study/blob/main/zero/js/lotto.htmlgithub.io: https:

2022년 9월 30일
·
0개의 댓글
·
post-thumbnail

[JS] 야구게임

10회 안에 성공해야하는 야구게임, 반복문, Math.random()4자리 무작위 숫자 뽑기input 입력값이 형식에 맞는 지 검사new Set(), includes() 함수 홈런인지, 10번 시도했는지 검사아래의 코드를 중복 제거볼, 스트라이크, 아웃 검사아웃 부분을

2022년 9월 30일
·
0개의 댓글
·
post-thumbnail

[JS] 계산기 만들기

계산기 만들기, 고차함수, if 중첩disabled과 readonly 차이 disabled인 경우는 사용자가 입력을 할 수 없고, 값이 아예 전달되지 않는다. readonly인 경우는 사용자가 입력을 할 수 없고, 값이 전달된다.(js로 컨트롤 가능)기본 세팅숫자 입

2022년 9월 29일
·
0개의 댓글
·

[JS] 끝말잇기 게임

참가 인원을 정하고 각 차례마다 올바른 제시어를 입력하는 끝말잇기 게임.기본 세팅제시어 저장 변수 생성 prompt()로 참가 인원 확인 총 인원 화면에 표시하고 number 변수에 저장제시어 입력input 입력값 변수 newWord에 저장제시어가 비어있는지 판단 \

2022년 9월 29일
·
0개의 댓글
·

TIL16 자바스크립트 기본2

NodeList라는 특수한 객체, 배열의 속성이나 매서드를 쓸 수 없는 경우가 많음.(arguments도 마찬가지)!\[](https://velog.velcdn.com/images/raquim47/post/9 5160971-75b7-4023-b8b4-41c4f

2022년 9월 17일
·
0개의 댓글
·

TIL15 자바스크립트 복습

참고 사이트 모던자바스크립트 튜토리얼: https://ko.javascript.info/ 교재: https://thebook.io/080270/part01/ch01/01/05-03/ 코드 실행 소중대괄호의 이름을 알아두자. () parenthese, {} braces,

2022년 9월 17일
·
0개의 댓글
·

TIL14 라우터 이동할 때마다 특정 컴포넌트의 스타일 바꾸기

리액트로 쇼핑몰 만들고 있다. 위와 같이 Login 부분의 폰트 컬러를 페이지마다 다르게 하고 싶었다.store.js에 다음과 같이 state를 만들고"/Main", "/Men"로 라우터 이동해서 각각의 컴포넌트가 렌더링 될 때마다 위에서 만든 state를 ""값 혹은

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

TIL13 개발 블로그에 무슨 글을 남겨야 될까?

개발 블로그 하나쯤 있는 게 취업시 도움된다하여 만들었는데 벌써 현타가 왔다. 공부한 내용을 정리하는 것, 예컨대 강의에서 배운 기본적인 이론이나 문법에 대해 기록하는 것이 무의미할지도 모른다는 생각 때문이다. 사실 그런 것들은 굳이 이곳 블로그가 아니더라도 구글링으로

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

TIL12 filter()

1) filter()주어진 함수의 테스트를 통과하는 모든 요소를 모아 새로운 배열로 반환.즉, array의 지우고 싶은 item만 제외하고 새로 만들 수 있음.새 array에 포함할 item은 주어진 함수 테스트에서 true가 나와야함. false는 제외.2) 예시

2022년 9월 3일
·
0개의 댓글
·

TIL11 랜덤 매서드

1) Math 매서드Math.random(): 0과 1사이의 랜덤한 숫자를 반환Math.round(): 인자를 반올림Math.ceil(): 인자를 올림(천장)Math.floor(): 인자를 내림(바닥)배열에서 랜덤한 값 뽑기2) createElement(), appen

2022년 9월 3일
·
0개의 댓글
·

TIL10 시계 만들기

1) setInterval(), setTimeout()setInterval(): MS마다 함수를 실행시킨다.setTimeout(): MS뒤에 함수를 실행시킨다.2) padStart()string 을 길게 만들어 주고 싶을 때 사용.뒤에서 추가하고 싶을 때는 padEnd

2022년 9월 3일
·
0개의 댓글
·
post-thumbnail

TIL09 localStorage

1) localStorage란?브라우저에 정보를 저장하고 싶을 때 사용하는 API.저장불러오기삭제2) 사용예제 로그인 이름 저장하기 https://github.com/raquim47/study/blob/main/nomad/js01/custom.js

2022년 9월 3일
·
0개의 댓글
·