# Worksheet

47개의 포스트
post-thumbnail

[자료구조] 배열, 큐, 스택, 링크드 리스트 (with python, js)

데이터를 나열하고, 각 데이터를 인덱스에 대응하도록 구성한 데이터 구조같은 종류의 데이터를 효율적으로 관리하고 순차적으로 저장하기 위해 사용한다.장점데이터에 빠르게 접근이 가능하다.단점데이터의 추가/삭제에 있어서 메모리 낭비 등의 고려할 점이 있다.미리 최대 길이를 정

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

[Worksheet 220531] Next.js 심화

https://nextjs.org/docs/going-to-production캐싱/DB-BE 동일 regionJS code는 최소화. js bundle 로드 타이밍 최적화로깅/오류 처리/404, 500 페이지 커스텀Lighthouse로 성능 측정/지원 브라우저

2022년 5월 31일
·
0개의 댓글
·
post-thumbnail

[Worksheet 220524] Next.js 기본

https://nextjs.org/learn/basics/create-nextjs-appNext.js는 다양한 기능을 추상화해서 제공한다.파일 구조 그대로 url에 반영된다.페이지 이동할 때 a 태그 사용한 것페이지 이동할 때 next의 link 사용한 것\-

2022년 5월 24일
·
0개의 댓글
·

[Worksheet 220523] Next.js

Next.jsVercel(Frontend deploy flatform)이 만든 React Framework(for production)라이브러리를 표방한 React의 장점은 살리되 다양한 편의 기능들을 추가시킨 Framework의 필요를 충족시킨 Framework.렌더

2022년 5월 23일
·
0개의 댓글
·

[Worksheet 220523] GraphQL 심화

GraphQL

2022년 5월 23일
·
0개의 댓글
·
post-thumbnail

[Worksheet 220519] GraphQL

GraphQLAPI를 위한 Query Language.SQL : 구조화된 질의어RDBMS(관계형 데이터베이스 관리 시스템)의 데이터 관리를 위해 설계된 언어이다.DB로부터 데이터를 효율적으로 가져오기 위한 언어이다.GraphQL서버로부터 데이터를 효율적으로 가져오기 위

2022년 5월 19일
·
0개의 댓글
·

[Worksheet 220518] 상태관리 라이브러리 - Mobx

설치npm install mobxnpm install mobx-reactAction -> State -> Derivation / Reactionobserver를 통해서 react component가 mobx의 변경을 이해한다.makeAutoObservablemakeOb

2022년 5월 18일
·
0개의 댓글
·

[Worksheet 220518] 상태관리 라이브러리 - Redux

상태관리 라이브러리 Redux Flux Architecture Redux는 flux를 구현해놓은 라이브러리. Redux 특징 One way data flow 데이터가 단방향으로 흐른다. -> 컴포넌트가 많아지면 이슈가 발생 -> lifting up -> 복잡해

2022년 5월 18일
·
0개의 댓글
·

[Worksheet 220518] React 데이터 모킹 라이브러리

Mock(모의 데이터)을 만들어서 활용하는 방식data fetch를 해야하는 경우 통신을 통해 응답을 내려주는 서버가 있어야 한다. 그래서 모킹을 활용하면 서버를 만들지 않고 활용할 수 있다.API 요청으로 내려올 데이터를 프론트에서 모킹하거나, 서버의 역할을 해주는

2022년 5월 18일
·
0개의 댓글
·
post-thumbnail

[Worksheet 220517] React 라이브러리 - 스타일링

설치npm install --save styled-componentsglobal namespace글로벌 변수를 지양해야하는 js와 대치dependenciescss 간의 의존 관리dead code elimination안 쓰는 css 인지가 어려움minification클래

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

[Worksheet 220517] 라이브러리 기초 - Date

라이브러리 === 개발 편의를 위한 도구의 모음. 공구!프레임워크 === 기반 구조까지 잡혀있음. 공장!React는 도구(라이브러리)의 모음이다.필요특정 기능이 필요해지고 직접 구현하기에 벅차다.더 나은 도구가 필요해진다.트렌드에 따른 새로운 기술에 대한 호기심.검색사

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

[Worksheet 220517] React 공식 문서 고급 - PropsTypes, Reconcilation / React Dev Tool

Props의 타입을 확인하기 위한 도구 (flow, ts 와 같은 정적 타이핑 도구)타입 유효성 검사기prop에 유효하지 않은 값이 전달 되면 js 콘솔창에 보이고, 성능상의 이유로 개발 모드에서만 확인된다.propsTypes 내부에 함수를 넣어줘서 커스텀한 유효성 검

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

[Worksheet 220517] React 공식문서 고급 - Context, Protal, Render Props

컴포넌트 트리를 넘어 데이터를 공유할 수 있는 방법으로, Props drilling 을 해결하기 위한 방법이다.context를 사용하면 단계마다 일일이 props를 넘겨주지 않고도 컴포넌트 트리에 데이터를 넘겨줄 수 있다.전역적인 데이터를 관리할 때 유용하다. (로그인

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

[Worksheet 220516] React 공식문서 고급 - Composition, HOC, Memoization

React 공식문서로 디테일 잡기(고급) Composition Composition은 합성으로 어떤 컴포넌트 안에 컴포넌트를 넣는 것이다. 두 가지 방법이 있다. Children props Children을 사용해서 그대로 가지고 오는 방법이다. Custom

2022년 5월 16일
·
0개의 댓글
·

[Worksheet 220516] React 공식문서 고급 - Hooks

class의 단점을 보완하면서 라이프 사이클 등과 관련된 함수를 재사용 가능하게 한다.Hook을 이용하여 기존의 class 바탕의 코드를 작성할 필요없이 상태 값과 여러 react 기능을 사용할 수 있다.컴포넌트 사이에서 상태 로직 재사용의 어려움Hook은 계층의 변화

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

[Worksheet 220513] React 공식문서 초급

Ch 2. React 공식문서로 디테일잡기(초급) JSX javascript의 확장된 문법 React “엘리먼트(element)” 를 생성 Props props 컴포넌트에 전달되는 단일 객체 순수함수처럼 동작해야한다. props 자체를 수정해서는 안된다. 컴포

2022년 5월 16일
·
0개의 댓글
·

[Worksheet 220513] React Key, 상태 끌어올리기, Data Fetch

React 맛보기 Key와 리랜더링 여기서 이런 warning이 뜬다. unique한 key 값이 필요하다는 것. key? value를 특정하는 이름! 우리도 지정해준 id 값이다. 컴포넌트들을 잘 재사용하기 위해서는 unique한 id 값을 지정해주고 사용해야

2022년 5월 13일
·
0개의 댓글
·

[Worksheet 220512] React Style, useRef, Form

className문자열style객체, 카멜 케이스.className보다 우위에 있어서 먼저 적용된다. 덮어씌워짐.DOM 조작하기DOM과 Element의 차이?input 태그가 새로고침 되자마자 바로 focus 되게 하기getElementByIduseRef 사용해서 만들

2022년 5월 12일
·
0개의 댓글
·

[Worksheet 220512] React Hook

React 맛보기 useState Component elements의 집합 useState 상태 값을 관리해주는 hook 위의 코드에서 setState를 두고 요소가 변경될 때마다 다시 render 해주어야 하는 불편함이 있었는데, useState() 를 사용

2022년 5월 12일
·
0개의 댓글
·

[Worksheet 220504] React

React 맛보기 JSX const element = hihi JavaScript의 확장 문법 HTML 태그를 변수화 할 수 있다. 멀티 element `` `` element 찍어내기 재사용 가능한 함수를 만들어서 element를 쉽게 만들어낸다. Cus

2022년 5월 4일
·
0개의 댓글
·