profile
기록하는 개발자 Ayden 입니다.
post-thumbnail

멋쟁이사자처럼 프론트엔드 스쿨 2기 58_Day

TDD1-1 Jasmine1-2 Jest(React)면접 대비🕵️‍♀️ TDD 란?테스트 주도 개발이라는 뜻으로 말그대로 테스트 코드를 먼저 작성하여 의도한대로 동작하는지 확인한 뒤에 기능을 구현하는 개발 프로세스이다.✍ TDD 단계1\. 실패하는 작은 단위 테스트

2022년 6월 28일
·
0개의 댓글
·
post-thumbnail

멋쟁이사자처럼 프론트엔드 스쿨 2기 43_Day

Test간단한 Vi command 명령서버 관련 용어정리서비스 배포 절차React추후 프로젝트 진행 시 협업할 반을 공정하게 배정하기 위해 테스트를 진행했고 점수를 받았다. HTML, CSS, JavaScript에 대한 전반적인 개념 문제가 19문제이고, DOM 제어

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

멋쟁이사자처럼 프론트엔드 스쿨 2기 42_Day

페이지 교체 알고리즘트리와 그래프2-1 트리2-2 그래프🕵️‍♀️페이지 교체 알고리즘이란?새로운 값을 메모리에 추가해야 될 때 이미 값이 할당된 메모리 중에서 어느 것과 교체할지를 결정하는 것이라고 생각한다.✍ Hit & Miss메모리에 해당 값이 있다면 cache

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

멋쟁이사자처럼 프론트엔드 스쿨 2기 41_Day

Linked List정렬2-1 선택 정렬2-2 삽입 정렬2-3 병합 정렬🕵️‍♀️Linked List(연결 리스트)란?각 노드가 데이터와 포인터를 가지고 한 줄로 연결되어 있는 방식으로 데이터를 저장하는 자료 구조이다.위 코드는 오늘 강의 시간에 학습한 연결 리스트의

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

CORS 에러 및 해결

blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set

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

멋쟁이사자처럼 프론트엔드 스쿨 2기 40_Day

three.js🕵️‍♀️three.js란?웹 페이지에서 3D 효과를 표현할 수 있게 해주는 자바스크립트 라이브러리이다.Scene : 전체 공간Mesh : 실제 오브젝트들(캐릭터, 바닥 등)Camera : 사용자가 실제로 보는 화면(Rederer)을 담는 녀석Light

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

멋쟁이사자처럼 프론트엔드 스쿨 2기 39_Day

Ajax자료구조와 알고리즘🕵️‍♀️ Ajax(에이작스)란?자바스크립트를 이용하여 브라우저가 서버에게 비동기적으로 데이터를 요청하고, 응답 받은 데이터를 동적으로 페이지 렌더링 하는 방식을 Ajax(Asynchronous Javascript and XML)라고 한다.

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

모듈화

🕵️‍♀️모듈화란?코드 재사용성, 메모리 낭비를 피하기 위해 파일 단위로 분리하는 것이다.

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

멋쟁이사자처럼 프론트엔드 스쿨 2기 37_Day

localStorage🕵️‍♀️localStorage란?웹 스토리지 중 하나로 key와 value 형태의 데이터이며, 페이지 새로고침, 재실행해도 데이터가 사라지지 않는다. 아래 사용법을 보면 알겠지만, Map 자료형과 흡사하다.✍ 사용법localStorage.set

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

멋쟁이사자처럼 프론트엔드 스쿨 2기 36_Day

정규식 표현promise / async, await🕵️‍♀️정규식 표현이란?문자열을 표현하는 데 사용하는 형식 언어이다. 예를들어 "AbbCd123" 이라는 문자열이 있을 때 숫자만 뽑아내거나 대문자, 소문자, 알파벳 등등 필터링해서 결과를 얻고 싶을 때 사용한다.어

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

멋쟁이사자처럼 프론트엔드 스쿨 2기 35_Day

최적화웹페이지 렌더링2-1 파싱2-2 스타일 계산2-3 레이아웃2-4 페인트2-5 컴포지팅반응 시간3-1 requestAnimationFrame 3-2 Document fragment메모리4-1 메모리 생명 주기4-2 메모리 누수와 Garbage Collection🕵

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

함수 Scope

다이나믹 스코프(동적 스코프) : 함수가 실행되는 시점에 상위 스코프가 결정이 된다. transaction_a 함수가 실행되면 add(1)이 실행되는데, add에는 balance 가 없기 때문에 상위 스코프인 transaction_a 의 balance를 가져오게 된다.

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

멋쟁이사자처럼 프론트엔드 스쿨 2기 34_Day

생성자 함수1-1 사용자 정의 패턴1-2 모듈 패턴1-3 모듈 패턴 + 사용자 정의 패턴클래스2-1 클래스 상속2-2 비공개(private) property이전 게시물에 포스팅한 생성자 함수 패턴은 사용자 정의 패턴으로 외부에서 데이터를 쉽게 관리할 수 있다.중요한 정

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

기명 함수 익명 함수

기명함수 같은 경우는 브라우저가 런타임(RunTime) 이전에 선언되는 함수이다.익명함수 같은 경우는 브라우저가 런타임(RunTime)에 선언되는 함수이다.즉, 호이스팅으로 일반 함수(기명 함수)가 먼저 실행된다.결과는 var func 변수에 호이스팅으로 먼저 선언 되

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

멋쟁이사자처럼 프론트엔드 스쿨 2기 33_Day

stopPropagation객체지향 프로그래밍2-1 생성자2-2 prototype2-3 객체 상속🕵️‍♀️ stopPropagation이란?지난 게시물에 포스팅한 event.preventDefault는 이벤트 동작 자체를 막을 수 있지만 이벤트 전파를 막을 수는 없었

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

멋쟁이사자처럼 프론트엔드 스쿨 2기 32_Day

carousel1-1 CSS1-2 JavaScriptpreventDefault🕵️‍♀️carousel이란?캐러셀은 컨베이어 벨트라는 뜻으로 컨텐츠를 슬라이드 형태로 구현하는 것이다.위치와 크기에 대한 스타일링은 제외하고 캐러셀에 대한 스타일만 작성했을 때 위와 같은

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

동기와 비동기

작업이 순차적으로 이루어져야 할 때 비동기 처리를 하면 그 순서가 보장되지 않는다.promisepromise를 사용하면 비동기 메서드를 마치 동기 메서드처럼 사용할 수 있다. 에러 처리가 가능하다.✍ 상태// pending (대기) 상태// pulfilled (이

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

멋쟁이사자처럼 프론트엔드 스쿨 2기 30_Day

JavaScript DOM1-1 DOM1-2 innerText VS textContent1-3 append VS appendChild1-4 innerHTML VS insertAdjacentHTML1-5 캡처링 이벤트 VS 버블링 이벤트1-6 target VS curre

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

멋쟁이사자처럼 프론트엔드 스쿨 2기 29_Day

JavaScript 함수1-1 클로저(Closure)1-2 생성자 함수Map, Setthis3-1 bind3-2 call3-3 applyJSON🕵️‍♀️클로저(Closure)란?위 소스코드를 예제로 클로저를 다음과 같이 정의할 수 있다.첫 번째, 폐쇠된 공간 안에서

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

멋쟁이사자처럼 프론트엔드 스쿨 2기 28_Day

JavaScript 함수1-1 호이스팅1-2 재귀함수1-3 call by value, reference구조 분행 할당, 스프레드 문법2-1 스프레드 문법2-2 구조 분해 할당🕵️‍♀️함수란?입력, 출력, 기능을 하나로 묶어 재사용 할 수 있도록 만드는 것이다.유사한

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