웹 프론트엔드 개발자를 꿈으로, 4학년 2학기에 접어드는 나는, 올해 6월부터 공부를 시작하였다. 그러던 와중, k-digital training 사업을 하는것을 보고, 마지막 학기에 성장하기 좋은 기회라 생각 되어 2군데를 지원 하였다. 하나는 강남의 F 학원, 나머
js와 프론트엔드메모리흐름 제어배열과 객체스코프와 클로저네트워크 기초컴퓨터 시간 원리암호화앞으로의 공부 방향브라우저에서 버튼을 눌었을때 dom alert 등을 이용한 동적 기능 및복잡한 ui 지도 유튜브같은 페이지 가능하게 되었답니다.최근에는 서버: node.js n
js의 함수형, 객체지향과 프로토 타입js의 모듈, 이벤트 루프,정규표현식쿠키와 세션, 웹스토리지알고리즘의 중요성객체란 것을 통해 데이터와 메소드를 묶고 객체간 통신데이터 파이프라인에 형태객체지향 추상화의 최소단위는 객체,함수형은 함수가 최소단위이다.재 사용성이 높다불
자료구조배열 스택 큐 해시 테이블 그래프 연결리스트리스트를 제외한 나머지는 개념만 짚고 넘어가겠습니다. 연관된 데이터를 연속적인 형태로 가지고 있음배열의 특징고정된 크기를 가지며 일반적으론 동적으로 크기를 늘릴 수 없다.자바스크립트처럼 대부분의 스크립트 언어는 동적으로
TIL 자료구조(트리, 우선순위 큐, 힙, 트라이) 과제가 있었던 트리를 알아보겠습니다. 트리 방향 그래프의 일종으로 정점을 가르키는 간선이 하나 밖에 없는 구조를 가지고 있다 루트 정점을 제외한 모든 정점은 반드시 하나의 부모 정점을 가진다 정점이 n개인 트리는
메모리에 올려져서, 실행 중 인 프로그램입니다.ex)하드디스크에 있는 프로그램을 실행하면, 실행을 위해서 메모리 할당이 이루어지고, 할당된 메모리 공간으로 바이너리 코드가 올라가게 된다. 이 순간부터 프로세스라 부릅니다.운영체제 안에서 프로세스들의 자원들의 스케줄을 정
dfs에 대해서 먼저 알아보자.a->b->c->d 순으로 탐색코드:코드function bfs(graph, v, visited) { // 큐 구현 const queue = v; // 현재 노드 방문 visitedv = true; // 큐가 빌 때까지 반복 wh
팁DOM TREE & 랜더링이터레이터제너레이터느낀점포스팅에 앞서 강의 내용 중 팁html css 공부 방법?사례를 그냥 외우는게 좋다.codepen.io 사이트로 css 구조 참고!이후에 알아볼 것은css id와 class차이점=>만약 id가 여러개면?css 선택자 종
제너레이터함수의 결과물에 대해서도 map을 할수 있기에 모든것들을 map을 할 수 있다.유연하고 다형성이 높다이터러블 프로토콜을 따른 map의 다형성을 코드로 알아 볼 수 있다.구현:값을 축약하는 함수하나의 값을 누적해 나갈때 사용보조함수를 통해 어떻게 축약할지 완전히
컴퓨터 프로그래밍에서 느긋한 계산법(Lazy evaluation)은,계산의 결과 값이 필요할 때까지 계산을 늦추는 기법이다. 지연 평가를 하면 필요 할 때까지 계산을 늦추면서 불필요한 계산을 줄일 수 있다불필요한 계산을 하지 않으므로 빠른 계산이 가능하다.-> 자료가
요청과 결과가 동시에 일어난다.A노드와 B노드 사이의 작업 처리 단위(transaction)를 동시에 맞춘다는 것요청과 결과가 동시에 일어나지 않는다.노드 사이의 작업 처리 단위를 동시에 맞추지 않아도 된다.동기보다 필요할때 사용하기에 효율적이다.동기는 추구하는 같은
스코프와 클로저의 이해, var const let의 차이에 대해 설명 할 수 있는가? var(함수단위평가,재할당가능)let(블럭단위평가,재할당가능)const(블럭단위평가,재할당불가능)유효범위. 즉 변수에 접근 할 수 있는 범위를 의미한다.코드출처: MDN이처럼 myFu
간단한 todo list app만들면서 컴포넌트 방식으로 생각하기 client side에서 데이터 저장하기 컴포넌트? 컴포넌트(Component)란 프로그래밍에 있어 재사용이 가능한 각각의 독립된 모듈을 뜻한다. 그림에서 확인 할 수 있듯이 컴포넌트 기반 프로그래
es6 모듈 사용하기 import export 키워드로 내보내진 변수, 함수 등등을 불러올 수 있는 키워드 입니다. 사용법 > module-name 내에 export default로 내보내진 것을 가져옵니다. >module-name 내에서 export 된 모든
fetch api 사용하기fetch는 http error가 발생하더라도reject 되지않는다네트워크 에러나 요청이 완료되지 못한 경우에만reject 됩니다그러므로 서버 요청 중 에러가 생겼을 경우에도 then으로 떨어지므로, response의 status code나 o
👶떨렸던 교육생 선발 프로세스 부터, 💥처음했던 마음가짐이랑 지금의 나는 어떤지 한번 돌이켜 보는 시간을 가져보려고 합니당 자료구조 이해 및 구현브라우저의 동작과정 및 dom이해js만의 특징 이해바닐라 js로 내가 구상한데로 자유롭게 구현약했던 운영체제 파트 스터디
sap(single page application) sap가 무엇인지를 알려면 기본적으로 웹이 어떻게 동작하는지를 알아야 이해하기 좋습니다. 일반적인 정적인 웹페이지 html파일들로 페이지가 구성 url이 파일 경로와 이름이 됨 url 상 파일명이 없을경우 ind
그동안의 배웠던 지식을 바탕으로, 필요에 따라 api를 호출하면서 todoList, totoApp 을 만들었다. 코드는 강사님의 코드가 대부분이라 공개가 어렵다ㅠ 사실 배운내용이 거기안에 다 있는데 포스팅에 담지 못해 아쉽다.그래서 오늘은, 브라우저 환경에서 마주칠
바닐라 JS만을 이용해 📄노션을 클로닝📄합니다.기본적인 레이아웃은 노션과 같으며, 스타일링, 컬러값 등은 원하는대로 커스텀합니다.해당 프로젝트는 크게 문서 목록과 편집기 두가지 부분으로 구성되어있다. 문서 목록 루트 문서들을 보여준다. 루트 문서에 하위 문서가 있는
바닐라 JS만을 이용해 📄노션을 클로닝📄합니다.기본적인 레이아웃은 노션과 같으며, 스타일링, 컬러값 등은 원하는대로 커스텀합니다.해당 프로젝트는 크게 문서 목록과 편집기 두가지 부분으로 구성되어있다. 문서 목록 루트 문서들을 보여준다. 루트 문서에 하위 문서가 있는
바닐라 JS만을 이용해 📄노션을 클로닝📄합니다.기본적인 레이아웃은 노션과 같으며, 스타일링, 컬러값 등은 원하는대로 커스텀합니다.해당 프로젝트는 크게 문서 목록과 편집기 두가지 부분으로 구성되어있다. 문서 목록 루트 문서들을 보여준다. 루트 문서에 하위 문서가 있는
바닐라 JS만을 이용해 📄노션을 클로닝📄합니다.기본적인 레이아웃은 노션과 같으며, 스타일링, 컬러값 등은 원하는대로 커스텀합니다.해당 프로젝트는 크게 문서 목록과 편집기 두가지 부분으로 구성되어있다. 문서 목록 루트 문서들을 보여준다. 루트 문서에 하위 문서가 있는
바닐라 JS만을 이용해 📄노션을 클로닝📄합니다.기본적인 레이아웃은 노션과 같으며, 스타일링, 컬러값 등은 원하는대로 커스텀합니다.해당 프로젝트는 크게 문서 목록과 편집기 두가지 부분으로 구성되어있다. 문서 목록 루트 문서들을 보여준다. 루트 문서에 하위 문서가 있는
바닐라 JS만을 이용해 📄노션을 클로닝📄합니다.기본적인 레이아웃은 노션과 같으며, 스타일링, 컬러값 등은 원하는대로 커스텀합니다.해당 프로젝트는 크게 문서 목록과 편집기 두가지 부분으로 구성되어있다. 문서 목록 루트 문서들을 보여준다. 루트 문서에 하위 문서가 있
바닐라 JS만을 이용해 📄노션을 클로닝📄합니다.기본적인 레이아웃은 노션과 같으며, 스타일링, 컬러값 등은 원하는대로 커스텀합니다.해당 프로젝트는 크게 문서 목록과 편집기 두가지 부분으로 구성되어있다. 문서 목록 루트 문서들을 보여준다. 루트 문서에 하위 문서가 있는
JS 걸음마를 이제 뗏다고 생각했는데,👶 제대로 잘 동작하는 노션을 만드려니 막막했다. 그러나 3주차 회고때 했던 나의 다짐을 생각하며, 부딛혀보고 막상 닥치면 어떻게든 된다는 마음가짐으로 하였다. 사실 3일차 까지만 해도 기한 내에 비슷한 몇개의 기능이라도 제대로
선언방법 행(row) 열(col) 정하기
.box { $w:100px; @if($ != 100px){ width: $w; } @else{ width: 200px; }}//비교 연산자// and or not .box { $w: 100px; $h: 200p
@mixin @include && 내장모듈 media
내장모듈-list,map function 반복
나는 2개월 동안.....개발 블로그 시작(천천히 잊기위해)막연했던 진로 확실히 정하기!(나는 프론트엔드!!다.)본격적인 '미래를 위한' 개발 공부시작git(pr등을) 익혀 협업 간접경험해보기개발공부til,블로그정리팀원과의 pr && 리뷰능동적인 자세를 기르기.=>남들
어떤 Vue 인스턴스나 컴포넌트가 생성될 때, 미리 사전에 정의된 몇 단계의 과정을 거치게 되는데 이를 라이프사이클(lifecycle)이라 합니다. 다시 말해, Vue 인스턴스가 생성된 후 우리 눈에 보여지고, 사라지기까지의 단계를 일컫는 말입니다.공식 문서에서Vue
첫 만남의 설렘을 뒤로한 채, 각자의 아이디어와 생각해 온 협업 툴과 일정을 정했다. 아이디어는 현실적으로 가능한지, 참신한지, 주제와 맞는지 등등 여러 사항을 고려하여 선택했다.각자 구현페이지를 정했고, 나는 메인 페이지를 맡게 되었고, 디자인은 메인페이지, 사이드
https://offstory.netlify.app/🟢 전부 해결🟡 일부분 해결/리팩토링 필요🔴 해결 못함✅로그인 상태유지를 위해 쿠키를이용->나중에는 세션스토리지를 이용 \-> 🤷♂️왜? 개인정보는 세션스토리지를 이용하여 브라우저를 나갈시 자동적