[Day 6] JavaScript 주요 문법 (6)
·
Frontend/프로그래머스 FE 데브코스
자료구조&알고리즘 - BFS, DFS [Algorithm] DFS 정리 (tistory.com) [Algorithm] DFS 정리 1. DFS란? - DFS 는 깊이 우선 탐색 을 말합니다. - 루트 노드에서 시작하여, 해당 노드들의 자식을 우선적으로 탐색합니다. * 미로찾기로 예시를 들면, 한 방향으로 갈 수 있을 때까지 계속 가다가 aeunhi99.tistory.com [Algorithm] BFS 정리 (tistory.com) [Algorithm] BFS 정리 1. BFS란? - BFS 는 너비우선탐색을 말합니다. - 루트 노드에서 시작하여 인접한 노드를 탐색하는 방법입니다. Q. 너비우선 탐색을 하면 순서가 어떻게 될까요? A. 0 - 1 - 2 - 3 - 4 - 5 -6 1) 특징 - 두 노 ae..
[Day 5] JavaScript 주요 문법 (5)
·
Frontend/프로그래머스 FE 데브코스
💡 실습 문제 - 가장 먼 노드 [프로그래머스] 가장 먼 노드(JavaScirpt) (tistory.com) [프로그래머스] 가장 먼 노드(JavaScirpt) 코딩테스트 연습 - 가장 먼 노드 | 프로그래머스 스쿨 (programmers.co.kr) 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 aeunhi99.tistory.com 자료구조&알고리즘 - 트리 1. 트리 - 방향 그래프의 일종으로 정점으로 가르키는 간선이 하나 밖에 없는 구조 1) 용어 Degree(차수) : 한 정점에서 나오는 간선의 개수 Level : 루트부터 리프노드까지 단계(루트가 0,1로 시작하여 커진다) 2) 특징 루트 정점을 제외한 모든 정점은 반드시 ..
[Day 4] JavaScript 주요 문법 (4)
·
Frontend/프로그래머스 FE 데브코스
자료구조&알고리즘 - 큐 1. 큐 - First In First Out 개념을 가진 선형 자료구조 - Linear Queue와 Circular Queue가 존재함 - EnQueue, Rear, Front, DeQueue 1) Linear Queue 선형 큐 ⓐ Array로 구현 class Queue { constructor() { this.queue = []; this.front = 0; this.rear = 0; } enqueue(value) { this.queue[this.rear++] = value; } dequeue(){ const value = this.queue[this.front]; delete this.queue[this.front]; this.front++; return value; } ..
[Day 3] JavaScript 주요 문법(3)
·
Frontend/프로그래머스 FE 데브코스
자료구조와 알고리즘 1. 뜻 1) 자료구조 : 여러 데이터들의 묶음을 저장하고, 사용하는 방법을 정의한 것 - 메모리를 효율적으로 사용하고 빠르게 안정적으로 데이터를 처리하는 것이 목표 2) 알고리즘 : 정해진 일련의 절차나 방법을 공식화한 형태로 표현한 것 - 특정 문제를 효율적이고 빠르게 해결하는 것이 목표 자료구조의 종류 1. 단순 구조 - 정수, 실수, 문자열, 논리 2. 선형 구조 : 자료들이 선형(한 원소뒤엔 하나의 원소)으로 나열되어 있는 구조 - 배열, 연결리스트, 스택, 큐 3. 비선형 구조 : 원소 간 다대다 관계를 가지는 구조(계층형, 망형) - 트리, 그래프 시간 복잡도 [Algorithm] 시간복잡도 이해하기 (tistory.com) [Algorithm] 시간복잡도 이해하기 1. ..
[Day 2] JavaScript 주요 문법(2)
·
Frontend/프로그래머스 FE 데브코스
네트워크 기초 1. 웹페이지 로딩 과정 1) URL을 해석한다 (scheme://:@;/) 2) DNS를 조회한다 DNS는 도메인과 IP 주소를 서로 변환 DNS로 요청을 보내기 전에 브라우저 캐시와 hosts 파일을 참조 (있다면 ip를 반환함) DNS는 보통 통신사(ISP)에서 제공하는 것을 사용 DNS을 운영하는 서버를 보통 Name Server라고 부름 3) 해당 IP가 존재하는 서버로 이동 4) ARP를 이용하여 MAC 주소로 변환 * 네트워크 내 ARP를 브로드캐스팅 시 해당 IP 주소를 가진 기기가 MAC 주소 반환 * IP주소 - 논리적 주소, MAC 주소 - 물리적 주소 5) TCP 통신을 통해 Socket을 연다 네트워크를 통해 해당 기기로 패킷을 전달 3 way handshake로 연..
[Day 1] 자바스크립트 주요 문법 (1)
·
Frontend/프로그래머스 FE 데브코스
JavaScript와 프론트엔드 개발 1. JavaScript 탄생 배경 최초의 브라우저 : Tim Berners-Lee 에 의해 개발 최초의 상용 브라우저 : 네비게이터 - Brendan Eich에 의해 Mocha라는 이름의 언어 개발 -> LiveScirpt -> JavaScript 2. JavaScript로 무엇을 할 수 있을까? 서버 개발, 앱 개발, 프론트엔드 개발 3. 브라우저 동작 원리 1) 통신 : 서버와의 통신 - 브라우저가 요청을 보내면 서버가 응답함 2) 렌더링 : Dom(트리구조)이란 객체를 화면에 그리는 것 3) 스크립트 실행 : 자바스립트 실행 4. 프론트엔드 개발자의 역할 1) 역할 - 브라우저에서 동작하는 UI를 개발하는 것 - 디자이너와 백엔드 사이 일정을 잘 조율하는 것이..
[React] React 완벽 가이드 섹션 18 : Redux
·
Frontend/Study
https://www.udemy.com/course/best-react/ 【한글자막】 React 완벽 가이드 with Redux, Next.js, TypeScript Javascript부터 웹 어플리케이션 배포까지, React와 프론트엔드 최신 기술을 가장 쉽고 확실하게 배우는 법 www.udemy.com 1. Redux 1) 개념 : 크로스 컴포넌트, 앱 와이드 상태를 위한 상태 관리 시스템 - 우리의 상태를 변경하고 화면에 표기하는 데이터를 관리하도록 도와주는 역할 2) State의 종류 ⓐ 로컬 state : 데이터가 변경되어서 하나의 컴포넌트에 속하는 UI에 영향을 미치는 상태 👉 useState를 이용하거나 더 복잡하다면 useReducer을 사용하여 관리할수 있음 ⓑ Cross-componen..
[Js] 2차원 배열 new Array().fill()로 값 할당할 때 주의할 점
·
Frontend/Article
요새 프론트엔드가 js로 코딩테스트 보는게 많아져서 js로 여러 알고리즘 문제를 풀고있는데... 알고리즘 문제를 풀다보면 배열을 초기화 해놓고 그 배열을 이용하는 경우가 많다. 그래서 js도 배열을 초기화하는 메서드 fill 이 있길래 그걸 주로 이용했엇는데 2차원 배열에선 절대 사용하면 안되는걸알았다... let arr = new Array(4).fill([]); for(let i=0;i
[React] React 완벽 가이드 섹션 13 클래스 컴포넌트
·
Frontend/Study
1. 클래스 컴포넌트 - 과거에 많이 사용한 컴포넌트 선언 방식 * React 16.8이전에는 사이드 이펙트(훅)를 다루기 위해서는 클래스 기반 컴포넌트를 사용했어야 했다. // 클래스 class User extends Component { render(){ return {this.props.name}; } } // 함수형 const User = (props) => { return {props.name}; }; - props는 this예약어를 사용해야하고, Component를 상속받아야 한다. - render() 를 사용한다. class Users extends Component { constructor(){ super(); this.state = { // 상태 조각과는 상관없이 state는 객체가 된다..