TIL

Acievement Goals 1프로그래밍은 데이터를 처리를 하는 것임을 이해한다.변수 사용은 데이터를 편리하게 저장하고 꺼내 쓰는 것임을 이해한다.변수의 선언과 값의 할당에 대해서 설명하고 코드로 작성할 수 있다.값으로 변환된 표현문이 변수에 할당되어 담기는 과정을

문자열Achievement Goals문자열의 속성과 메소드를 이용해 원하는 형태로 만들 수 있다.문자열의 length라는 속성을 활용해 길이를 확인할 수 있다.문자열의 글자 하나하나에 접근할 수 있다.문자열을 합칠 수 있다.문자열을 원하는 만큼 선택할 수 있다.영문을

반복문Achievement Goals반복문을 활용하여 단순한 기능을 반복하여 수행할 수 있다.for문과 문자열, 숫자를 이용해 반복적으로 코드를 실행시킬 수 있다.기본적인 for문 (for(let i=0;i<5;i++))을 응용하여 다양한 for문을 만들 수 있다

HTML : Hyper Text Markup Language 웹페이지의 틀을 만드는 마크업 언어 HTML은 TAG들의 집합이다. TAG : 부등호()로 묶인 HTML 기본 구성 요소 sth.html 확장자를 사용한다. Tree structure

계산기 만들기 >### Achievement Goals html과 css, javascript의 연결과정을 이해할 수 있다. 계산기를 구현하는 과정마다의 논리를 세우고 이를 코드로 작성할 수 있다. > #### 계산기 모양 CSS CODE > Javascrip

CLI 시작하기 >* #### 터미널은 CLI(Command-Line interface)이다. 용어정리 >* #### pwd(print working directory) : 현재 위치를 확인할 수 있는 명령어 mkdir(make directory) : 새로운 폴더

Git 사용법 익히기 > ### Achievement Goals Git의 환경설정을 할 수 있다. 버전 관리 시스템의 필요성을 이해할 수 있다. Github와 Git의 관계에 대해 이해할 수 있다. Repository에 대해 이해할 수 있다. Local Reposit

반복문을 통해 대량의 정보를 처리하는 방법을 학습했다면, 배열을 통해 대량의 정보를 보관하고 관리하는 법에 대해서 학습합니다. > ## Achievement Goals 배열기초 >* 배열에서 사용되는 다음 용어에 대해 정확히 이해할 수 있다. 배열에서 특정 in

배열과 객체 review > ### 배열 문제 arr이라는 배열이 빈 배열인지 확인하는 알맞은 방법은? 넘버,스트링,불리언... 원시타입 배열,객체...참조타입 length === 0 이면 배열에 요소가 없기 때문에 0 이다. arr = []는 공백은 배열을 할당한

Achievement Goals > * 다양한 CSS Selector 규칙을 이해할 수 있다. > * 레이아웃을 위한 HTML을 만들 수 있다. > * Flexbox를 이용해 레이아웃을 만들 수 있다. > * flex-direction : 방향 > * flex-grow

스코프와 클로저 Achievement Goals > 원시 자료형(primitive type)과 참조 자료형(reference type)의 구분이 왜 필요한지에 대해서 영상을 보고 이해할 수 있다. > 원시 자료형과 참조 자료형의 차이를 이해하고, 각자 맞는 상황에서

Achievement Goals > * Spread/Rest 문법, 구조 분해 할당을 사용할 수 있다. Spread 문법 > * 주로 배열을 풀어서 인자로 전달하거나, 배열을 풀어서 각각의 요소로 넣을 때 사용한다. Rest 문법 > * 파라미터를 배열의 형태로 받

DOM(Document Object Model) > #### 프로그래머 관점에서 바라 본 HTML으로 HTML을 단순한 문서에서 웹 앱으로 업그레이드 할 수 있다. What is DOM? > #### Achievement Goals > * DOM의 개념을 이해할 수

Pseudo code > * 아이디를 입력했을 시 4자리 이상이면 1. HTML > * id와 class 생성하기

이벤트 객체 > #### 사용자입력(onclick, onkeyup, onscroll 등)을 트리거로 발생한 이벤트 정보를 담은 객체다. DOM LIVE sprint review function handleClick(e) { // 아래의 빈

고차함수 > #### 함수를 인자로 받을 수 있고, 함수의 형태로 리턴할 수 있는 함수 변수에 할당할 수 있다. 다른 함수의 인자로 전달될 수 있다. 다른 함수의 결과로서 리턴될 수 있다.

React에 대해 배워보자 > * 웹, 데스크톱, 모바일 등 다양한 플랫폼에서 활용할 수 있는 프론트엔드 라이브러리다. > ### 사전요구지식 (모르겠으면 공부하고 오기) > * HTML/CSS 기초 > * JS 기초 > * 함수형 프로그래밍과 고차함수 개념에 대한

React SPA Achievement Goals > * SPA 개념을 이해하고 설명할 수 있다. > * SPA의 장,단점에 대해 이해하고 설명할 수 있다. > * 와이어프레임을 보고 어느 부분을 컴포넌트로 구분할지 스스로 정할 수 있다. SPA의 등장 배경, 개념

React State & Props > * state, props의 개념에 대해서 이해하고, 실제 프로젝트에 바르게 적용할 수 있다. > * React 함수 컴포넌트(React Function Component)에서 state hook을 이용하여 state를 정의 및

비전공자이기 때문에 수업내용을 집중학습하고 실습에 개념을 확실히 적용해본다.교육엔지니어분들이 추천해주신 수업내용 학습 + 복습 후 Achievement Goal를 직접 입으로 설명하며 공부를 마무리한다.JS/NODE 기초과정은 생각보다 쉽게 느껴져서 공부할 때 크게 집

경우의 수를 하나씩 입력해주는 절차형 프로그래밍과 달리 인간이 사고하는 것 처럼 효율적으로 코드를 적는 방식이다.하지만 이 또한 패러다임이기 때문에 무조건 객체지향이 좋은 것은 아니며 객체지향 프로그래밍은 JAVA가 거의 유일하다.캡슐화(Encapsulation) :

재귀의 의미에 대해서 이해하고, 자바스크립트에서 재귀 호출을 할 수 있다.재귀를 언제 사용해야 하는지 알고 있다.재귀적 사고 연습을 통해 재귀 함수를 base case와 recursive case로 나눠서 작성할 수 있다.자료 구조 중 Tree 구조에 재귀 함수를 사용

JSON.stringify 와 JSON.parse 가 seriealize, deserialize라는 것을 이해할 수 있다.JSON.stringify 와 JSON.parse 를 사용하여 자바스크립트 값과 JSON을 넘나들 수 있다.JSON에 재귀 호출을 사용할 때, 어디

자료구조 Achievement Goals > * 자료구조가 무엇인지 설명할 수 있다. > * stack, queue, Tree, Graph 자료구조에 대해 이해할 수 있다. > * 트리 및 그래프의 탐색 기법에 대해 이해할 수 있다. > * 자료구조를 활용하여 알고리

Graph 그래프 용어 > * 노드(Node) : 정점(vertex)라고도 불리며 목적지를 나타내는 점을 말한다. 일반적으로 노드에는 데이터가 저장된다. > * 간선(edge) : 목적지와 목적지를 이어 주는 선. > * 무향(undirected) : 방향이 없기 때

underbar sprint를 통해 javascript의 고차함수에 대해 깊게 이해해보자.

동기(syncronose) + blocking > * 하나의 작업이 완료된 후 , 다음 작업이 실행되는 구조 ex) 커피에 사장님 한 분뿐이라 손님들은 앞 손님의 주문이 끝나고 커피가 나올 때 까지 기다렸다가 주문 해야 함 비동기(asyncronose) +Non-b

Fetch API에 대해 알아보자.

AG > * 클라이언트-서버 콘셉을 이해할 수 있다. > * 브라우저의 작동 원리를 이해할 수 있다. > * HTTP messages의 구조를 설명할 수 있다. > * Chrome Network Tab을 이해할 수 있다. > * Self Guided Lessons를 스

시험끝나면 폭풍작성하기

참조 > * Node.js 공식문서 https://expressjs.com/ko/ Express란 > * 웹 및 모바일 앱을 위한 간결하고 유연한 Node.js 웹 애플리케이션 프레임워크다. Express 실행방법 > Express 기본 형태 > 기본 라우팅

SSR CSR CORS

웹 어플리케이션에서는 HTTP 메소드를 이용해 서버 통신한다.Representational State Transfer의 약자로 웹에서 사용되는 데이터나 자원을 HTTP URI로 표현하고, HTTP 프로토콜을 통해 요청과 응답을 정의하는 방식REST API 성숙도 모델을

문제를 해결하는데 걸리는 시간과 입력의 함수관계핵심이 되는 연산을 찾아서 표시한다.계산식의 가장 큰 지수를 고려하고 계수는 무시한다.n^2 + 2n = O(n^2) 2n^4 + 3n = O(n^4)정렬된 배열에서 원하는 값을 찾는 방법

해를 찾는 도중, 지금의 경로가 해가 될 것 같지 않으면 그 경로를 더 이상 가지 않고 되돌아간다.학창시절 수형도라고 부르는 나뭇가지를 그려 모든 경우의 수를 생각했던 것에서 더 나아가, 절대로 안될 것 같은 부분은 제외하고 경우의 수를 생각하는 알고리즘이다.주로 문제

forEach, map의 공통점은 배열을 이용하고 각 요소에 원하는 조작을 해줄 수 있다는 점이다.하지만 차이가 있다면 이것이다.결론 : forEach()는 기존 배열의 요소를 변경하지만, map()은 새로운 배열을 반환한다.

vscode에서 div를 입력하면 div가 자동완성되면서 옆에 emmet이라는 글이 보인다. 이는 개발자들이 자주 사용하는 tag를 자동완성하도록 만들어준 vscode 내장 프로그램이다.

백엔드에서 중요한 API 작성하기.

기존에 배운 개념 서버에서 정의한 API 문서를 통해, 서버가 제공하는 리소스를 이용할 수 있다. AJAX 통신을 가능하게 하는 fetch API를 이용할 수 있다. UI를 구성하고, 컴포넌트를 분리할 수 있다. React의 props와 state 개념을 이해할 수 있

CORS : 교차 출처 리소스 공유보통 서버는 보안상의 이유로 다른 origin이 보내는 HTTP 요청을 제한하는데 이러한 문제는 최근 Github, Youtube 등 다양한 서버를 사용해야 하는 추세가 되며 다른 origin을 사용해야 하는 경우가 많아졌다. 이 때

Component Driven Development 기획자와 디자이너, 개발자가 정해진 방식의 UI 컴포넌트를 미리 디자인하고 개발해 일의 효율성을 높히는 방식을 말한다.

React가 상태관리 라이브러리는 아니지만, 상태관리의 주요원칙을 배운다면, 컴포넌트 간의 loose coupled, 구조적으로 아름다운 코드를 작성할 수 있다.상태의 정의 : 변하는 데이터 그러므로 UI상에 동적으로 표현될 데이터를 뜻함.장바구니에서 상품선택여부/선택

Redux를 이용한 상태관리 Action 객체는 Dispatch 에게 전달되고, Dispatch를 호출해서 새로운 state를 생성 Redux 기본 개념 UI에서 상태가 변하는 컴포넌트를 클릭한다. Dispatch 전달인자로 Action객체를 전달하고 Reducer에 전달한다. Reducer 에서는 Action의 type에 따라 다른 동작을 수행하는데...

내 레포지토리에서 클론한 파일을 수정한 후 push를 하면 잔디가 안심기는 경우가 있었는데 해결방법을 찾았다. 먼저 터미널에서 해당 디렉토리로 이동 후 git config --edit을 입력한다. 다음과 같이 입력한다. 이유는 해당 디렉토리에서 push를 할 때 해당 디렉토리의 .git 폴더의 config 파일에서 이메일이 존재하지 않거나 일치 하지 ...

개발자가 필수로 가져야 하는 역량 필요한 기능을 빠르게 구현하는 것 -> 기술면접에서 면접관이 기능 구현을 요구하면 라이브코딩 해야하는데 이 때 필요하다. 기능에 해당하는 테스트를 작성하는 것 -> 기능구현을 테스트를 통해 보여줘야 함 그럼 개발자들이 말하는 테스트는 무엇일까? Testing : 소프트웨어 테스트를 말하며 제품 또는 서비스의 품질을 확인...

서버에서 CORS가 클라이언트의 요청을 판단하는 조건은 4가지다.

외부 API를 통해 데이터를 가져올 때 useEffect를 사용하면 화면이 새로 렌더링 된다. 이 때 데이터를 몇 번 호출 했는지를 카운트 했는지 알려준다.데이터를 불러 올 때 API 호출이 한 번만 되어야 테스트 케이스를 통과할 수 있었다.currentMovie가

CSS 정리

수시로 확인하기

컴퓨터 구조 + 운영체제

코딩테스트를 위한 파이썬 기초문법

Linux 기반 사용권한, 환경변수 기초

코딩테스트 개요

✍ 순열과 조합 중복순열 : 요소의 중복을 허용해서 순서를 부여해 조합하는 모든 경우의 수 주어진 요소의 개수보다 많은 요소를 뽑을 수 있다. [사과,오렌지,레몬] 에서 중복순열이 허용된다면? [사과,사과,오렌지,레몬] 순열인 경우는 같은 값이 들어오면 안되므로

미루고 미루던 정규화에 대한 기초 공부

오버라이딩과 오버로딩

데이터베이스 트랜잭션

데이터베이스 용어정리

Obect-Relational Mapping의 약자로 쉽게 이해하자면 Model과 DB를 통역하는 역할을 말한다.앞서 MVC 퍠턴을 공부하면서 view-controller-model의 관계를 이해했었다.DB가 sql이기 때문에 model에 sql문법을 작성하고 cont

MVC를 왜 사용하는가?

SQL 개념과 기본 문법

컴퓨터 공학 기초

운영체제 기초

Token 기초 + 스프린트 리뷰

AWS 기초

HTTP 헤더

Docker 기초

공개키, 대칭키 방식과 이를 합한 SSL 방식

콘솔로그 찍기

node 버전 고정하기.

런타임 : 컴퓨터 프로그램이 실행되고 있는 동안의 동작. 버킷 : 버킷은 Amazon S3에 저장된 객체에 대한 컨테이너입니다. 버킷에 저장할 수 있는 객체 수에는 제한이 없습니다. 또한 계정에 버킷을 최대 100개까지 포함할 수 있습니다. 정적 파일 : 서버의 개

JS에서 import와 require의 차이점

로드밸런서 생성 방법

반드시 이해하기

데이터 조회 시 timezone이 적용되려면?

클라이언트 -> 서버로 authorization 보내기 서버에서 authorization 코드 받아서 kakao에 토큰 요청보내기 받은 토큰을 가지고 유저정보 요청하기 받은 유저정보토큰을 해독해서 db에 저장하기 클라이언트한테 토큰전달 된 후 로그인 상태, 로그인유저 정보도 바꿔줘야 한다. 클라이언트는 토큰을 받아서 유저정보를 받아야 한다. 이 정보를 ...

프록시 개념

replace 함수와 정규식 함수 기초

웹 브라우저 작동원리를 5단계로 설명합니다.

호이스팅과 TDZ 관계

SOP 개념에 대한 정리

CSR 과 SSR 작동원리 공부

process와 Thread의 차이

에라토스테네스의 체

함수 vs 메소드

JS의 컴파일러 Babel 과 polyfill

변수만들때 let, const, var차이 let 재선언 금지, 재할당 가능 const 재선언 금지, 재할당 금지 var 재선언 가능, 재할당 가능 let a = b; let a = c; //재선언 금지 let a = b; a = c; //재할당은 가능 const a = b; const a = c; //재선언 금지 const a = b; a = c;...

Scale Up 서버의 자원이 부족하여 서버의 스펙을 상승 시키는 것을 말함 AWS에서는 스펙이 더 좋은 인스턴스 타입으로 교체하는 것이라고 할 수 있음. Scale Out 서버의 자원 스펙 상승으로는 한계가 있으며 효율이 떨어지는 시점이 있다. Scale Out은 컴퓨팅의 성능 상승보다 컴퓨팅 수를 늘리는 것이다. Scale In 작업이 완료되어 ...

발생한 에러 해결방법 해당 RDS의 보안그룹에 들어가 모든 소스가 접근할 수 있도록 소스유형을 IPv4, IPv6 모두 가능하도록 설정 결과

app-root-path 라이브러리 어느 경로에서도 루트경로를 찾을 수 있도록 해주는 라이브러리다. 사용 경험 기존에 app.js 에서 을 사용 했었다. 하지만 모듈화를 위해 src/config 폴더 안에 log.js를 생성하여 해당 코드를 이동시켰다. 이 때 이러한 에러를 마주쳤다. __dirname이 현재 log.js의 상위폴더인 config...