TIL

CSS 복습 및 새로 알게 된 개념 정리!

JSON; 데이터를 주고 받을 때 쓸 수 있는 {key: value} 형태의 가장 간단한 파일 포맷

Array 다수의 데이터를 저장하고 처리하는 경우에 유용하게 사용

Array APIs

함수 표현식(Function Expression)과 함수 선언문(Function Declaration)

화살표 함수(arrow function)

web font size

함수, 콜백, 비동기 처리

closure, arguments, apply

Git and Github

Object

1. this 2. 상속(inheritance) 3. prototype

1. 표준 내장 객체의 확장 2. Object 3. 데이터 타입 4. 참조

HTML_Tag

HTML_Form01

HTML_Form02 & Table

HTML_Meta

HTML practice note_01

HTML practice note_02

HTML practice note_03

CSS practice note_01 Box - Box Model, Box Sizing, Box Type

CSS practice note_02 Float

CSS practice note_03 Position - static, relative, absolute, fixed, z-index

CSS practice note_04 Flexbox

CSS practice note_05 Media Query

CSS practice note_06 Typography, Typography Library, Webfont

CSS practice note_07 Background, Transition, Animation

CSS practice note_08 Selectors

📓 새로 알게된 정보 메모 남기기

CSS practice note_09 Box Shadow, Opacity, Overflow, Transform, Visibility

📓 새로 알게된 정보 메모 남기기

📓 새로 알게된 정보 메모 남기기

CSS practice note_10 Page Layout - Grid System, Bootstrap

📓 새로 알게된 것 메모 남기기

JavaScript method

css final project를 통해 responsive web, media query 익히기

css final project를 통해 responsive web, media query 익히기

css final project를 통해 responsive web, media query 익히기

JavaScript 비교 연산자 반복문(for, while)

JavasScript - 배열, 함수, return, 매개변수와 인수

JavaScript - 숫자형

JavaScript - 객체

JavaScript - 순서도 그리기

JavaScript - 끝말잇기 놀이 (순서도 그리기)

JavaScript - 계산하기 게임 (고차함수, event 객체, if문 중첩 줄이기)

JavaScript - 숫자야구 게임 (랜덤함수, 배열메서드)

JavaScript - 로또 추첨기 (블록/함수 스코프, 클로저)

JavaScript - 가위바위보 게임 (image sprite, setInterval, 객체, removeEventListener, 플래그 변수)

JavaScript - 반응 속도 테스트 (비동기 코드, class, Date 객체, reduce)

틱택토(Tic Tac Toe) 게임 (삼목게임) - 이차원 배열 다루기(이중 반복문), 구조분해 할당, 이벤트 위임, every, some, flat

JavaScript - Closure(외부/내부 함수, 렉시컬 환경, 스코프 체인)

JavaScript - this

JavaScript - Class(클래스)

JavaScript 비동기 함수 실행 순서, JavaScript Engine, 이벤트 루프(Event Loop)

JavaScript - optional chaining, 재귀 함수, Error에 따른 해결방법

JavaScript - documentFragment MouseEvent, KeyboardEvent

알고 있으면 좋을만한 내용들

JavaScript - (자바스크립트 동작 방식 이해를 위한)실행 컨텍스트, 호이스팅, 클로저

브라우저와 서버 사이에 웹사이트가 화면에 출력되기까지의 과정

http vs. https HTTPS가 필요한 이유

JS에서 가장 많이 발생하는 에러, 화살표 함수로 비동기 코드(타이머, 이벤트리스너) 작성하기, 일반 함수 표현을 화살표 함수를 이용해 한 줄로 표현하기, 객체 안에 있는 속성에 접근하는 방법

Semantic Tag를 통해 Semantic Web 만들기

레이아웃을 구성하고 요소의 위치를 지정하는 속성들♪ position, display, float

git 403 Error git과 친해지는 날이 오기를

Git과 Github Terminal에서의 Git 명령어 Github에 Repository 생성하고 내 프로젝트 업로드하기

Semantic Web을 만들기 위해 적절한 Semantic Tag 사용하기

CRA 초기 세팅 후 git을 이용해 처리할 작업

React 시작하기 CRA 설치 과정 Node.js, npm

리액트 나에게 너무 먼 당신...User Interface(웹 UI)를 만들 수 있게 도와주는 라이브러리사용자에게 UI를 보여주고 이벤트를 처리하는 작업을 수행합니다.✨ 1. React는 Component로 이루어진 UI 라이브러리입니다.Component란 한 가지의

📌 Warning: Expected onFocus listener to be a function, instead got a value of string type.error messageonFocus 안에 string이 아니라 함수로 넣어주라는 의미이다.<문제>o

📌 Unexpected tokenESLint errorESLint 구문 분석에서 예기치 않은 토큰 오류는 JavaScript ES6~7의 지속적인 변경으로 인해 개발 환경과 ESLint의 현재 구문 분석 기능 간의 비호환성으로 인해 발생합니다.ESLint를 호환 가능

team project flow$ git branch$ git checkout master$ git pull (origin/master)$ git checkout '내가 작업한 브랜치'$ git checkout feature/signup$ git merge master

(현재 작업 중인 브랜치에서)$ git add .$ git commit -m "커밋메시지"(main 또는 master 브랜치로 이동 ← pull하기 위해)$ git checkout main(rebase하기 전에 pull 받아와서 동기화. conflict 발생하면 해결하

Mission!🔽 map() 함수를 사용하지 않고 작성한 코드🔽 map() 함수를 사용해 반복문으로 작성한 코드주의! map()을 사용할 때 꼭 해줘야 할 부분!※ Warning: Each child in a list should have a unique "key"

feature/main 브랜치에 쌓인 커밋을 하나로 정리하기 위해 rebase 시도$ git rebase -i main이후 confilct이 발생(rebase 도중 충돌이 일어날 경우 마치 코드가 날아간 것 처럼 보일 수 있으나, 코드가 사라진 것이 아니라 코드를 합치

원래 연결되어 있는 원격 저장소를 끊고, 새롭게 생성한 내 github repo로 origin 설정하고자 합니다. (개인 repo로 fork하지 않기!🍴)$ git remote -v현재 연결된 원격 저장소 확인$ git remote remove origin연결이 제대

Array.prototype.map() expects a return value from arrow function.다음과 같은 경고문을 본 적이 있으신가요?아래 코드에서 화살표 기호(=>) 부분에 eslint 경고가 발생했으며,props로 받아 온 배열을 배열 내장

React Hook useCallback has missing dependencies: 'onInsert' and 'value'. Either include them or remove the dependency array. If 'onInsert' changes too

클래스형 컴포넌트의 생명 주기 메서드

리액트 라우터 적용하기

리액트 클래스형과 함수형

리액트에서 반복문을 만들 때 사용되는 map과 key

state와 props

조건부 렌더링(삼항 연산자)과 && 연산자를 사용한 조건문 작성, useState와 useRef의 차이

리액트 라이프사이클(componentDidMount, componentWillUnmount, componentDidUpdate)과 useEffect

실행 컨텍스트: 실행할 코드에 제공할 환경 정보들을 모아놓은 객체(Stack)호이스팅(hoisting): 변수 정보 수집자바스크립트 엔진은 식별자들을 최상단으로 끌어올려놓은 다음 실제 코드를 실행한다고 알고 있지만실제로 끌어올리지 않으며, 편의상 끌어올린 것으로 간주한