profile
공부한 내용들을 작성하는 곳입니다. 피드백은 언제나 환영입니다!
post-thumbnail

많이 쓰이는 Dockerfile 명령어 7가지

명령어 숙지하기

2023년 1월 25일
·
0개의 댓글
·

4주 동안의 팀 프로젝트 회고

코드캠프 팀 프로젝트 회고

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

CI / CD

Continuous Integration CI는 지속적 통합을 의미한다. 테스트 등을 거쳐 배포 준비 상태로 만드는 것. 간단히 설명하자면 빌드/테스트 자동화 과정이다. CI가 성공적으로 구현된 프로젝트는 프로젝트의 코드 변경 사항이 생길 때 마다 빌드 및 테스트가 이루어진 후 공유 레포에 통합까지 자동으로 되어 여러명의 개발자가 협업할 때 코드 작업 ...

2022년 10월 27일
·
0개의 댓글
·
post-thumbnail

SEO와 웹 사이트 렌더링 기법들 간의 관계

SEO란? SEO는 Search Engine Optimization의 약자로 직역하자면 검색 엔진 최적화 라고 할 수 있다. 검색 엔진 최적화는 검색 엔진으로부터 웹 사이트나 웹 페이지에 대한 트래픽의 품질과 양을 개선하는 과정이다. 검색 엔진 최적화를 위해서는 시멘틱한 태그의 작성부터 웹 페이지 렌더링 기법까지 작은 부분부터 큰 틀을 정하는 것까지 ...

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

코드 캠프 37일차) Docker 입문

CDN - LB 두가지 배포 분기 Docker >프로세스와 쓰레드 > 프로세스가 하나의 컴퓨터로 생각한다면, 쓰레드는 그 컴퓨터에서 돌아가는 하나의 프로그램이다. > 리눅스 command pipe (|) > 이 파이프는 명령어를 연결하는 역할을 하는데, 파이프의 왼쪽에 있는 명령어의 결과를 바탕으로 오른쪽 명령어를 실행할 수 있는 특징을 가지고 있다. >...

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

코드 캠프 36일차) HTTP와 HTTPS

HTTPS / SSL / TLS EC2 Load Balancer HTTPS HTTPS는 무엇이며, 왜 필요한가? WireShark 네트워크 패킷 네트워크 Source는 출발지를 의미함. 약자로 src 도착지는 Destination 약자로 dst Port Number ( 0 ~ 65535 중 랜덤으로 배정받는다. ) localhost -> 3000...

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

LazyLoad vs PreLoad

LazyLoad란? 페이지를 읽어들이는 시점에 중요하지 않은 리소스 로딩을 나중에 하는 기법. 나중에 필요할 때(스크롤을 내려 콘텐츠를 확인한다던가, 사용자에게 직접 마우스 클릭과 같은 입력을 요구한다던가)로드가 되게 한다. 왜 쓰는가? 예를 들어, 스크롤을 한참 내려야 할만큼 많은 이미지를 불러와야하는 페이지가 있다고 가정했을 때 그 많은 이미지를 ...

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

코드 캠프 24일차) 리액트 훅 폼

React-Hook-Form Yup Common-Component type 과 interface 차이 type은 같은 이름으로 작성 불가, interface는 가능(선언 병합) 긴 이름의 타입은 코드 흐름에 필수적이지 않다면 따로 빼놓자..! 1. React-Hook-Form input태그들이 모여있는 입력 양식에는 form 태그를 사용해서 묶어주면 ...

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

코드 캠프 27일차) 웹 에디터와 XSS

Web-Editor Cross-Site-Script (XSS) Hydration-Issue 1. Web Editor 웹 에디터 라이브러리 React Draft Wysiwyg(What You See Is What You Get) React Quill TOAST UI Editor 오늘은 React Quill 을 한 번 가볍게 사용해볼까 한다. 먼저 np...

2022년 10월 25일
·
0개의 댓글
·
post-thumbnail

Recursive Function

재귀함수는 다음과 같이 자기 자신을 호출하는 함수이다. 이렇게 선언한 뒤, 실행시키면 자기 자신을 끝도 없이 호출하기 때문에 Stack Overflow Error를 만나게 된다. 그래서 재귀함수는 자기 자신을 통제해줄 exit condition이 반드시 필요하다. 재귀함수를 설명하는 예시로 가장 많이 보이는 것이 바로 팩토리얼 구하기 이다. 팩토리얼...

2022년 10월 25일
·
0개의 댓글
·
post-thumbnail

React Currying

Currying이란? 일단, 뭔지 몰라서 구글에 검색부터 해봤다. 뭐라고 하는지 모르겠으니 한국어로 번역을 해보자.그렇다. Currying은 카레였던 것이다...!!Currying은 추상적으로 두 개의 인수를 취하는 함수라고 되어있다. Currying은 HOF(High-Order-Function) 고차함수의 모습과 매우 닮아있다. 그도 그럴 것이 고차...

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

== 과 ===

==, === 자바스크립트는 부등호를 제외하고 두 개의 비교 연산자를 가지고 있다. 바로 ==과 ===이다. == == 연산자는 느슨한 비교 연산자이다. 이 연산자는 서로 다른 유형의 두 변수의 값을 비교한다. 여기서 서로 다른 유형의 값을 비교한다는 것은 타입이 다르더라도 값이 동일하면 같다로 간주한다는 것이다. 말보다는 예시가 설명이 빠를 것이다....

2022년 10월 25일
·
0개의 댓글
·
post-thumbnail

코드 캠프 35일차) 배포 시작

Cloud SSG / LB DNS 클라우드의 탄생 배경 옛날에는 사용자가 어느 순간에 갑자기 폭발적으로 증가하는 스타트업이란 개념이 없었다. 사용자가 폭발적으로 증가하는 이 순간을 감당해내느냐 못해내느냐로 성공과 실패가 나뉘어진다. 이 고비에서 가장 많이 다뤄볼 수 있는 것이 바로 배포 이다. 서버용 컴퓨터를 3 대를 뒀을 때, 사용자를 각각의 컴퓨터...

2022년 10월 24일
·
0개의 댓글
·
post-thumbnail

Reduce

오늘은 배열 메서드 Array.prototype.reduce()에 대해 알아보자.

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

HOF, 고차 함수

HOF란? HOF는 High-Order-Function의 약자로, 고차함수라고 부른다. 그럼 어떤 걸 고차함수라고 부를까? 고차함수가 되기 위해서는 다음의 조건 중 최소한 하나를 만족해야 한다. >1. 하나 이상의 함수를 인자로 받는다. 함수를 리턴한다. 이런 고차함수는 주변에서 많이 찾아볼 수 있는데, 그 예시들이 바로 자바스크립트에 내장된 배열 ...

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

코드 캠프 31일차) 성능 최적화를 해보자

Memorization Preload / Prefetch Promise All 가비지 컬렉션.. 게임을 하다 보면 가끔 끊기거나 중간에 멈추는 현상이 발생하는데, 메모리가 차서 발생하는 현상으로 메모리가 꽉 찰 때 마다 비워서 빈 공간이 생기는 시간 동안 멈추게 된다. useMemo useCallback React.memo() HOC로 컴포넌트에 적...

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

Closure

이 글은 공식 문서 MDN을 기반으로 작성되었습니다.

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

권한 분기

용어부터 정말 어렵게 느껴지는 이 권한 분기.. 우선 단어 하나 하나를 뜯어서 해석해보자.

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

RegExp 정규 표현식

이 글은 MDN 공식문서를 기반으로 작성되었습니다.

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

Flatten | Unflatten

Flatten Flat은 평평한이라는 뜻이다. 서브웨이에 가면 먹을 수 있는 플랫 브레드의 플랫이 바로 Flat이다. 그렇다면 Flatten은? 평평하게 하다, 평탄화 하다 라는 뜻이다. 보통 어떤 배열의 깊이가 2 이상인 중첩 배열의 구조를 가지고 있을 때, 깊이를 1로 만들면서 요소는 유지하고 싶을 때 Flatten 기법을 사용한다. Js의 메서드...

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