user-thumbnail
@miniyoung37
TIL record
SERIES

TIL

[TIL] this, prototype, datastructure

2019년 9월 23일

👉이번 공부를 통해 prototype, proto에 대한 개념이 조금은 잡힌 것 같다. 하지만 아직도 this, datastructure에 개념이 완벽하지 않은 것 같아 좀더 공부하려 한다. 그리고 개념은 이해해도 아직 코드로 작성하는 것에 어려움을 많이 느낀다...

[TIL] Toy problem, HTML과 CSS

2019년 9월 24일

👉처음으로 알고리즘 문제를 접해봤는데, 머리 속에서는 접근방식과 이렇게 하면 될 거 같은데 라는 생각이 많았지만, 정작 코드 구현을 하는데 많이 부족함을 느꼈다.. 레퍼런스를 찾아보고 코드를 한번더 작성해보는 공부해봐야겠다. 👉HTML과 CSS 관련 과제가 있었는데, 제대로 작업하지도 못했다

[TIL] inheritance pattern, ES6

2019년 9월 25일

👉inheritance pattern 에는 functional functional-shared prototypal pseudoclassical 차이점 및 문법 👉ES6 변수 선언 1. const를 기본으로 사용 2. 변경이 될 수 있는 변수는 let을 사용 3. var는 사용하지 않는다. let block (f...

[TIL] N-Queens, Backtracking

2019년 9월 26일

👉Backtracking 모든 경우의 수를 전부 고려하는 알고리즘. 일종의 트리 탐색 알고리즘. 구조적으로 깊이우선탐색(DFS)을 기반으로 한다. 즉, DFS의 구조를 적용할 수 있는 문제에 적용될 수 있다. 어떤 노드의 유망성을 점검하고 유망하지 않으면 그 노드의 부모 노드로 돌아간 후 다른 자손의 노드를 검색하는 것. 즉, 스택에 자식노드...

[TIL] Interaction with Sever

2019년 9월 27일

👉 Browser 대표적인 터미널ex) 크롬, 웨일 👉 Client 터미널의 역할을 수행하는 컴퓨터, 사용자 입력을 주로 수행, 서버에 대한 응답을 화면에 표시 Messaging patterns Request-Response : 대표적으로 HTTP가 사용하는 메시징 패턴, 보통 동기적으로 작동하며, 연결이 열리면 응답이 전달될때까지 기다리거나, ...

[TIL] HTTP, Fetch

2019년 9월 27일

👉HTTP 메소드란? 클라이언트와 서버 사이에 이루어지는 요청(Request)과 응답(Response) 데이터를 전송하는 방식 1) HTTP 요청 헤더 포맷 클라이언트에서 서버로 보내는 메시지이며, 아래와 같은 구조 [Request Line] [ Header] [(white space)] [ Body ] 2) HTTP 응답 헤더 포맷...

[TIL]

2019년 10월 1일

👉Toy - commonCharacter Error Extra Credit: should return common characters between more than two strings 👉Destructuring assignment

[TIL]

2019년 10월 2일

👉 Toy - treeDFSelect Extra Datastructure study 👉 React Eventhandler 👉 lifting state up / Mount componentDidMount componentDidMount()는 컴포넌트의 결과물이 DOM에 mount된 직후 실행되는 메소드. 보통 다음과 같은...

[TIL] React LifeCycle

2019년 10월 3일

👉 url & API -youtube search url 참고 문서 : React 공식 문서

[TIL] React - onChange

2019년 10월 4일

👉 React의 onChange input 태그에 onChange를 사용할 경우 키 입력 시마다 발생 해결해야하는 점 : 키 입력 시마다 검색이 되기 때문에 검색어가 완성이 될때 검색이 될 수 있도록 수정 or 버튼 클릭시 검색하도록 수정 필요 ✔ dangerouslySetInnerHTML 문제 ✔ React에서의 이벤트...

[TIL] React - Router

2019년 10월 6일

👉 Todolist side-project todolist side project 진행을 하고 있는데, 처음 시작할 때 프로젝트 구조를 생각하는 것이 어렵고, 어떤 component로 구성할지가 어려운 것 같습니다. 🔨 React-Router 여러 화면이 구성된 웹 어플리케이션을 만든다면 필수적인 라이브러리이며, React-native에도 사용...

[ToDolist side Project - 회고]

2019년 10월 7일

👉 2일간 처음으로 혼자 진행한 Todolist를 완벽하게 완성하지 못했습니다. 진행하면서 많은 레퍼런스를 찾아보고, 배운 것을 적용해보려고 노력했지만, 생각한대로 되지 않아 답답함을 많이 느꼈다.....Todolist.....

[TIL] NodeJS

2019년 10월 8일

👉 NodeJS : Javascript를 기계어로 컴파일 해주고, NonBlocking으로 속도가 빠르다 1. Non-Blocking : Input/Output 작업이 진행되는 동안 유저 프로세스의 작업을 중단시키지 않는 방식 2. Node core modules : 따로 설치하지 않아도 node 내에 존재하는, 번들링되어 있는 모듈 fs / http...

[TIL] RESTful API

2019년 10월 9일

👉 RESTful API - 분산 시스템 설계를 위한 아키텍처 스타일 ( 아키텍처 스타일이라는 건 제약 조건의 집합) 따라서 RESTful API는 REST 아키텍처 원칙을 모두 만족하는 API REST와 RESTful은 엄격하게 다른 의미 👉 필요한 이유 1. RESTful API를 서비스하기만 하면 어떤 다른 모듈 또는 애플리...

[TIL] Package.json

2019년 10월 10일

👉 Package.json key value 형태 save 명령어 : package.json 에 저장 dependencies에 저장

[TIL] SSR & CSR

2019년 10월 11일

👉 서버사이드 렌더링 & 클라이언트 사이드 렌더링 모바일의 시대에 등장한 클라이언트사이드렌더링 Single Page Application(SPA) SPA는 최초 한번 페이지 전체를 로딩한 후 데이터만 변경하여 사용할 수 있는 애플리케이션 전통적인 웹 방식(SSR)은 서버사이드 렌더링 방식이다. 즉, 브라우저에 나타나는 형태 그대로를 HTML로 만들어...

[TIL] Callback vs Promise vs async&await

2019년 10월 12일

👉 CallBack 비동기 처리 방식 중 하나이다. 문제점 : Callback hell 비동기 처리 로직을 위해 콜백 함수를 연속해서 사용할 때 발생하는 문제이다. 콜백안에 콜백을 계속 무는 형식으로 이러한 코드 구조는 가독성이 떨어지고 로직을 변경하기 어렵다. 해결방법: Promise나 Async를 사용하는 방법 - Callback example...

[TIL] webpack & bundler

2019년 10월 14일

👉 webpack & bundler(Client-side Dependenies) webpack : bundling tool로서, create-react-app의 표준 번들러이며, 가장 대표적인 번들러 bundler : 지정한 단위로 파일들을 하나로 만들어서 요청에 대한 응답으로 전달할 수 있은 환경을 만들어주는 역할 👉 P...

[TIL] Databases

2019년 10월 15일

👉 Databases Goal ✔ 1. database 의 이해 2. database management system(DBMS)가 무엇인지 이해 3. SQL 기본 query문 사용 4. Schema의 설계 방법과 나은 방향성을 고안 5. 서버와 클라이언트 사이에서 데이터를 주고 받은 데이터를 database에 저장 🔨 SQL 이란...

[TIL] CRUD

2019년 10월 16일

👉 SQL 생성시 사용되는 문법(CRUD) - SHOW DATABASES : 데이터베이스 정보 보기 - CREATE DATABASE testDB : 데이터베이스 testDB 데이터 생성 - DROP DATABASE testDB : 데이터베이스 testDB 데이터 삭제 - CREATE TABLE Customers : 데이터 안 테이블 생성 - DRO...

[TIL] MVC pattern

2019년 10월 17일

👉 MVC pattern : 비지니스 처리 로직과 사용자 인터페이스 요소를 분리시켜 서로 영향없이 개발 하기 수월하다는 장점 1. Model : 애플리케이션이 '무엇'을 할 것인지를 정의, 처리되는 알고리즘, DB, 데이터 등 2. View : 화면에 무엇인가를 보여주기 위한 역할을 한다. Controller 하위에 종속되어, Model이나 Cont...

[TIL] Cookie & Session

2019년 10월 18일

👉 Cookie와 Session을 사용하는 이유 ? Http의 기능적 특성 때문이다. Connectionless와 Stateless - Connectionless:클라이언트가 서버에게 요청(Request)을 보내면, 서버는 클라이언트에게 응담(Response)를 한 후 바로 접속(연결)을 끊어 버리는 특성 - Stateless:서버와 클라이언트의 ...

[TIL] Crypto hash

2019년 10월 19일

👉 Crypto hash 란 ? ​ : 해시(hash)란 단방향 암호화 기법으로 해시함수(해시 알고리즘)를 이용하여 고정된 길이의 암호화된 문자열로 바꿔버리는 것을 의미 해시함수(hash function)는 임의의 길이의 데이터를 고정된 길이의 데이터로 매핑하는 함수이다. 이때, 매핑 전 원래 데이터의 값을 키(key), 매핑 후 데이터의 값을 해시...

[TIL] Token

2019년 10월 20일

👉 Token 기반 인증 왜 토큰을 사용하는가? 서버 기반 인증의 문제점 1. 세션 : 유저가 인증을 할 때, 서버는 이 기록을 서버에 저장을 해야한다. 이를 세션이라고 부른다. 대부분의 경우엔 메모리에 이를 저장하는데, 로그인 중인 유저의 수가 늘어난다면? 서버 렘이 과부화 가능성, 그를 위해 세션을 데이터 베이스에 저장한다면? 이 또한...

[TIL]

2019년 10월 25일

👉 React-router 👉 react 절대 경로 설정

[TIL] CORS

2019년 10월 26일

👉 CORS 도메인 또는 포트가 다른 서버의 자원을 요청하는 매커니즘. 이때 요청을 할때는 cross-origin HTTP에 의해 요청. 하지만 CORS 같은 상황이 발생 하면 외부서버에 요청한 데이터를 브라우저에서 보안목적으로 차단하기 때문에, 정상적으로 데이터를 받을 수 없다. ex) localhost:3000에서 react를 실행하였고, 서...

[TIL] Express

2019년 10월 28일

👉 백엔드 개발 - users, cafes, comments db schema - express 기본 서버 구축(MVC pattern) - 서울 지도 api 👉 Express-generator - 👉 Sequelize CLI : Sequelize는 Node.js에서 사용할 수 있는 ORM : Sequelize CLI는 명령...

[TIL] Git workflow

2019년 10월 29일

👉 Git workflow : 2주동안 진행되는 프로젝트가 개인 솔로 프로젝트가 아니고, 단체 프로젝트이기에 git을 통한 프로젝트 관리의 방법 또한 배우게 되었다. 처음엔 많이 복잡해보이지만, commit하기전에 git 위치를 확인하고 해야할 것 같다. image.png - 👉 2weeks project 포지션 변경 ...

[TIL] Git GUI Kraken

2019년 10월 31일

👉 Git GUI Kraken 사용 GUI 기반으로 Git을 다룰 수 있는 툴 중에서 Kraken을 이용 https://cupjoo.tistory.com/9

[TIL] Typescript

2019년 11월 3일

👉 Typescript 1. 함수 매개변수(parameter)의 타입 : 매개변수의 경우, 변수의 타입을 표기할 때와 마찬가지로 매개변수 뒤에 콜론(:)을 붙이고 타입을 적는다. (param1: number) 반환값(return value)의 타입 : 반환 타입은 매개변수 목록을 닫는 괄호())와 함수 본문을 여는 여는 대괄호({) 사이에...

[TIL] Redux

2019년 11월 11일

👉 Redux A predictable state container for Javascript apps 상태관리 라이브러리. 리덕스를 사용하면, 여러분이 만들게 될 컴포넌트들의 상태 관련 로직들을 다른 파일들로 분리시켜서 더욱 효율적으로 관리 할 수 있다. 또한, 컴포넌트끼리 상태를 공유하게 될 때 여러 컴포넌트를 거치지 않고도 손쉽게 상태 값을 전달...

[TIL] Apollo

2019년 11월 12일

🧨 Apollo - Apollo는 Client, Sever 라이브러리, 캐싱 및 쿼리 분석도구를 제공 - REST API는 Redux를 대체하는 GraphQL / Apollo - graphql을 기반으로 한 상태관리 플랫폼. 클라이언트에서 graphql을 사용하여 데이터를 가져오는 UI를 만들 때 사용하기 좋다. 🧨 Apollo를 사용하는...

[TIL] 코드스플리팅

2019년 11월 13일

👉 코드스플리팅 ​ 개발을 하게 되면, 하나의 파일에 모든 로직들이 작성되게 된다. 그렇게 되면, 프로젝트의 규모가 커질수록 파일 용량도 커지기 때문에, 인터넷이 느린 환경에서는 페이지 로딩속도도 느려질 수 있다. ​ 코드 스플리팅을 하게 되면, 지금 당장 필요한 코드가 아니라면 따로 분리시켜서, 나중에 필요할 때 불러와서 사용 할수 있다. 이를...

[TIL] HOC

2019년 11월 17일

👉 Higher - order Component (HOC) : 하나의 함수인데, 함수를 통하여 컴포넌트에 우리가 준비한 특정 기능을 부여한다. 반복되는 코드를 없애기 위해서 하나의 함수를 작성한다. HOC의 이름을 만들땐 with__ 형식으로 이름을 짓는다. HOC의 원리는, 파라미터로 컴포넌트를 받아오고, 함수 내부에서 새 컴포넌트를 만든 다음에 해...