profile
지식을 나눠요 📖
태그 목록
전체보기 (433)자바스크립트(112)JavaScript(110)리액트(43)React(42)타입스크립트(32)CSS(31)typescript(30)git(30)html(27)자료구조(22)노드(18)데이터베이스(17)node.js(16)알고리즘(14)C(14)타입(13)네트워크(12)디자인 패턴(12)(11)정렬(11)내장 객체(10)함수(9)vue.js(9)mysql(9)vue(8)(8)컴포넌트(8)리덕스(8)CLEAN CODE(8)ts(8)hook(7)객체(7)scss(7)github(7)ES6(7)연산자(7)리스트(6)OSI 7 Layer(6)mongodb(6)깃허브(6)트리(6)클린 코드(6)redux(6)몽고디비(5)css 전처리기(5)반복문(5)그래프(5)자바스크립트 함수(5)Sass(5)array(5)이벤트(5)클래스(5)비동기 처리(4)검색(4)라우터(4)이진 트리(4)폼 요소(4)브랜치(4)프로토콜(4)(4)배열(4)js(4)&&(4)function(4)소프트웨어(4)라이브러리(4)리덕스 미들웨어(4)class(3)HTML 폼(3)병합(3)DOM(3)Koa(3)셀렉터(3)데이터 조작문(3)OSI 7계층(3)Props(3)OSI(3)자바스크립트 연산자(3)자바스크립트 이벤트(3)메소드(3)프로그래밍 패러다임(3)스타일(3)연결 리스트(3)TDD(3)프로젝트(3)프론트엔드(3)소프트웨어 공학(3)함수 리터럴(3)클래스형 컴포넌트(3)interface(3)인터페이스(3)canvas(3)merge(3)http(3)주석(3)미들웨어(3)스타일시트(3)함수형 컴포넌트(3)패킷(2)네트워크 계층(2)(2)프레임워크(2)재귀(2)쿠키(2)모달(2)블록 요소(2)웹 표준(2)그래프 탐색(2)원격 저장소(2)Generics(2)변수(2)컴퓨터공학(2)커밋(2)modal(2)소프트웨어 개발(2)인라인 요소(2)리포지토리(2)디렉티브(2)object(2)기본 타입(2)템플릿 문자열(2)제네릭(2)소스트리(2)노션(2)State(2)컴포넌트 스타일링(2)관계형 데이터베이스(2)템플릿 엔진(2)모듈(2)ip(2)내장 타입(2)Map(2)웹 프레임워크(2)리액트 라우터(2)상속(2)백준(2)자바스크립트 알고리즘(2)velog(2)express(2)useState(2)정규 표현(2)div(2)타이머(2)타입 별칭(2)타입스크립트 제네릭(2)(2)데이터 타입(2)자바스크립트 배열(2)branch(2)에러(2)클린코드(2)클래스 상속(2)리액트 훅(2)hooks(2)type alias(2)반응형 웹(2)union(2)REST(2)타입 추론(2)linked list(1)stack(1)queue(1)vue cli(1)스크럼(1)애자일(1)스프린트(1)호이스팅(1)show()(1)html 하이퍼링크(1)git revert(1)transform(1)Pull Request(1)반응형 웹 페이지(1)이더넷(1)조건부 렌더링(1)tagged template strings(1)최대공약수(1)자바스크립트 에디어(1)react router dom(1)단락 회로 평가(1)클라우드 컴퓨팅(1)osi 모델(1)선언형 프로그래밍(1)heap(1)세션(1)thumbnail(1)sourcetree(1)nunjucks(1)반응형(1)이터레이터 패턴(1)canvas-api(1)BSON(1)스타일링(1)코딩테스트(1)BOM(1)패키지(1)캡쳐링(1)함수형 프로그래밍(1)순수 함수(1)시맨틱 태그(1)intersection(1)generator(1)iterator(1)앱 인스턴스(1)함수 시그니쳐(1)템플릿 리터럴 타입(1)이중 연결 리스트(1)콘텐츠(1)DSU(1)XMLHTTPRequest(1)데이터통신(1)응집도(1)애니메이션(1)DDL(1)Promise 객체(1)스타일 우선순위(1)마진(1)rgb(1)하이퍼링크(1)fs(1)상수(1)전송 계층(1)모뎀(1)비구조적 프로그래밍(1)추상 클래스(1)노드 취득(1)서브넷(1)캡슐화(1)동적 웹 페이지(1)산술 연산자(1)버블 정렬(1)CSS 스타일 시트 적용(1)계획(1)브라우저 객체 모델(1)Augmented Reality(1)라우팅(1)노드 워킹(1)리피터(1)파괴적인 메소드(1)허브(1)git rm --cached(1)투두 리스트(1)float(1)튜플(1)객체지향 프로그래밍(1)AVL 트리(1)구조적 프로그래밍(1)표현 계층(1)라이프사이클(1)다형성(1)힙 정렬(1)슬라이드 메뉴(1)클라우드(1)전개 연산자(1)HTTP2(1)리덕스 사가(1)개발자 도구(1)버전 관리(1)await(1)네트워크 7계층(1)서버(1)storybook(1)HTML Comment(1)useEffect(1)응용 계층(1)비교 연산자(1)JOIN(1)ajax(1)테스트 주도 개발(1)문서 객체 모델(1)세그먼트(1)px(1)Fetch API(1)for ~ in(1)함수 타입 호환성(1)react redux(1)비동기통신(1)type hierarchy(1)그리드 레이아웃(1)(1)컴포넌트 생명주기(1)데크(1)원형 큐(1)인접 리스트 그래프(1)데이터 모델(1)number(1)코덱(1)빌트인 디렉티브(1)type narrowing(1)자바스크립트 주석(1)결합도(1)async(1)Linear List(1)ref(1)parameter(1)인덱스드 엑세스 타입(1)padding(1)while(1)for(1)SOLID(1)network(1)내부 스타일 시트(1)hue(1)react hook(1)태그(1)git stash(1)웹 스토리지(1)엄격 모드(1)정적 메소드(1)Flex(1)데코레이터 패턴(1)오름차순 정렬(1)HTML 특수문자(1)github pages(1)선형 검색(1)at()(1)아날로그(1)nesting(1)Deque(1)익스프레스(1)타입 계층(1)플렉스 박스 레이아웃(1)자바스크립트 자료형(1)git diff(1)UI(1)tcp(1)카운팅 정렬(1)틸드 연산자(1)SCSS 컴파일(1)인수(1)Template Literal Types(1)frontend(1)es7(1)implements(1)색상 표기법(1)optional chaining(1)스키마(1)AR(1)falt()(1)비동기 통신(1)Backend(1)레이아웃(1)그룹 셀렉터(1)material ui(1)제곱 연산자(1)(1)jasmine(1)WCAG(1)pug(1)span(1)CSS 애니메이션(1)리액트 hooks(1)Koa 미들웨어(1)상대 경로(1)절대 경로(1)hoisting(1)클라이언트 사이드 렌더링(1)은닉(1)VOID(1)테두리(1)데이터 제어문(1)파일 시스템(1)조건문(1)break(1)문자열(1)캐스케이딩(1)테스트(1)replaceAll(1)margin(1)객체 확장 표현식(1)git log(1)any(1)sloppy mode(1)UDP(1)퍼그(1)사용자 인터페이스(1)발생자(1)switch(1)@media(1)명령형 프로그래밍(1)2021년(1)REST API(1)find(1)json(1)continue(1)비동기처리(1)슈퍼넷(1)React Color(1)이벤트 객체(1)const(1)커맨드 패턴(1)클로저(1)기본 값 매개변수(1)Indexed Access Types(1)회고록(1)파일 경로(1)브루트포스(1)CS(1)readme(1)스위치(1)filter(1)bootstrap(1)패딩(1)변수명(1)반복자(1)HTML 폼 요소(1)프로그래밍(1)스테이지(1)스타일 상속(1)리액트 리덕스(1)데이터 링크(1)대입 연산자(1)포트 번호(1)Web standards(1)Global 객체(1)koa router(1)스테이트 패턴(1)비트 연산자(1)String 객체(1)(1)스토리북(1)tsc(1)구글 웹 폰트(1)String(1)class 셀렉터(1)tree(1)Cohesion(1)commit(1)박스 모델(1)git merge(1)웹 폰트(1)데이터 정의문(1) 셸 정렬(1)가운데 정렬(1)타입 좁히기(1)소프트웨어공학(1)BFS(1)태그 셀렉터(1)퀵 정렬(1)외부 스타일 시트(1)미디어 쿼리(1)Math 객체(1)useMemo(1)useReducer(1)useRef(1)Sort(1)this(1)인덱스 시그니처(1)이벤트 구동 모델(1)short circuit(1)html2canvas(1)protected(1)테이블(1)Enum(1)세션 계층(1)Custom Hooks(1)컴파일러(1)예외처리(1)update(1)middleware(1)자바스크립트 this(1)이벤트 핸들러(1)styled components(1)useCallback(1)자바스크립트 변수(1)뷰 주석(1)script(1)reduce(1)border(1)가상 클래스(1)토플로지(1)정규식(1)notion(1)CSR(1)SSR(1)절차적 프로그래밍(1)선택문(1)프록시 패턴(1)비트(1)구조 분해 할당(1)팝업창(1)html 링크(1)Boyer Moore 법(1)요구분석(1)하노이 탑(1)id 셀렉터(1)자바스크립트 호이스팅(1)화살표 함수(1)(1)issue(1)www(1)console(1)크기(1)바나나(1)순차 검색(1)git reset(1)transition(1)트랜지션(1)유클리드 호제법(1)최소공배수(1)Array 객체(1)strict mode(1)배열 메소드(1)staging(1)애로우 함수(1)이진 탐색 트리(1)이진 검색(1)Tracked(1)Markdown(1)마크다운(1)readonly(1)tryCatch(1)로컬 스토리지(1)단축 평가(1)스택(1)form(1)tsconfig(1)extends(1)이벤트 리스너(1)Fetch(1)어댑터 패턴(1)Intersection Type(1)unknown(1)단순 삽입 정렬(1)타입스크립트 프로젝트(1)spa(1)display(1)템플릿 문법(1)rem(1)이넘 타입(1)jest(1)translate(1)지역 저장소(1)썸네일 제작(1)type 속성(1)유니온 타입(1)style(1)nosql(1)연산자 우선순위(1)자바스크립트 이벤트 객체(1)객체지향(1)퍼사드 패턴(1)JSX(1)react.js(1)데이터 통신(1)인접 행렬 그래프(1)git show(1) 도수 정렬(1)병합 정렬(1)내림차순 정렬(1)git-bash(1)분할과 정복(1)W3C(1)keyof 연산자(1)소프트웨어 개발 프로세스(1)마크다운 문법(1)DFS(1)Link태그(1)git reset HEAD(1)타입 단언(1)자료형(1)썸네일(1)스위칭(1)Proxy 객체(1)정적 웹 페이지(1)regexp(1)script태그의 위치(1)iframe(1)브루트 포스(1)깃 GUI(1)디지털(1)keyof(1)너비 우선 탐색(1)인접 리스트(1)전체 셀렉터(1)릴레이션(1)버블링(1)독서(1)do~while(1)numeric separators(1)HTML 테이블(1)템플릿 메소드 패턴(1)순회(1)캘린더(1)Date(1)타입스크립트 클래스(1)Function 생성자(1)바이트(1)프로토타입 체인(1)HTML 폼 속성(1)em(1)문자열 검색(1)트리 순회(1)소프트웨어 개발 생명주기(1)자바스크립트 바나나(1)기수 정렬(1).gitignore(1)함수 호환성(1)HTML 주석(1)상태관리(1)data structure(1)closure(1)private(1)깊이 우선 탐색(1)memo(1)물리층(1)for ~ of(1)tuple(1)set(1)연결 셀렉터(1)stash(1)타입스크립트 함수(1)인터프리터(1)자바스크립트 반복문(1)SCSS 변수(1)설계(1)never(1)nullish coalescing(1)세션 스토리지(1)싱글턴 패턴(1)계수 정렬(1)contextAPI(1)컴포넌트 반복(1)오픈 소스 소프트웨어(1)coupling(1)연관 배열(1)repl(1)익명 함수(1)html5(1)html 시맨틱 태그(1)테스트 도구(1)vim(1)논리 연산자(1)git clone(1)switch문(1)SOLID 원칙(1)소프트웨어 개발 프로세스 모델(1)animation(1)git add(1)텍스트 정렬(1)분기문(1)테스트 프레임워크(1)argument(1)(1)16진수 표기법(1)서버 사이드 렌더링(1)타입스크립트 인터페이스(1)웹 접근성(1)인접 행렬(1)type assertion(1)데이터링크층(1)증강현실(1)Symbol 객체(1)mixin(1)json 문서(1)인라인 스타일(1)회고(1)html 태그(1)접근 제어자(1)스테이징(1)mui(1)position(1)pakcage.json(1)SPA 페이지(1)union type(1)가상 요소(1)정적 프로퍼티(1)script태그(1)팩토리 패턴(1)import(1)추상화(1)hsl(1)백엔드(1)타입스크립트 타이머(1)넌적스(1)원형 연결 리스트(1)부트스트랩(1)style 태그(1)타입 주석(1)fast-forward(1)id(1)속성 셀렉터(1)HTML 이미지(1)TCP/IP(1)자바스크립트 스코프(1)npm(1)단순 선택 정렬(1)schema(1)ES2021(1)DML(1)인자(1)Vue 주석(1)오픈 소스(1)이벤트 핸들링(1)git commit(1)popup(1)데이터 바인딩(1)redux-logger(1)Graph(1)프로그래머스(1)alias(1)type inference(1)브랜치 병합(1)선형 리스트(1)Restful(1)redux thunk(1)redux saga(1)다크 모드(1)스코프(1)옵저버 패턴(1)List(1)플렉스 박스(1)코드 스플리팅(1)JavaScriprt(1)거듭 제곱 연산자(1)single page application(1)
post-thumbnail

[Vue.js] 빌트인 디렉티브

지난 포스트에서 템플릿 문법(https://velog.io/@bami/Vue.js-%ED%85%9C%ED%94%8C%EB%A6%BF-%EB%AC%B8%EB%B2%95-%EB%8D%B0%EC%9D%B4%ED%84%B0-%EB%B0%94%EC%9D%B8%EB%94

약 24시간 전
·
0개의 댓글
·
post-thumbnail

소프트웨어 개발 - 설계

이전에 배운 요구분석 단계가 끝나면 소프트웨어 개발은 설계단계로 진입하게 됩니다.설계는 사용자의 요구분석에 따라 요구분석명세서가 만들어지면 해당 문서를 참조해 개발팀에서 소프트웨어 설계서를 만들고 해당 설계서를 기반으로 구현을 진행하게 됩니다. 설계는 요구분석명세서에

2일 전
·
0개의 댓글
·
post-thumbnail

[Vue.js] 템플릿 문법 - 데이터 바인딩, 디렉티브

Vue는 컴포넌트 인스턴스 데이터들을 DOM에서 바인딩 할 수 있는 HTML 기반의 템플릿 문법을 사용하고 있습니다. 여기서 템플릿은 뷰 컴포넌트를 정의하면서 작성한 HTML, CSS, 로직을 브라우저에서 볼 수 있는 HTML의 형태로 변환하는 것을 의미합니다.다시말해

2일 전
·
0개의 댓글
·
post-thumbnail

[Vue.js] 앱 인스턴스

Vue.js로 앱을 제작하기 위해서는 인스턴스를 가장 먼저 생성해주어야합니다.Vue cli(https://velog.io/@bami/Vue.js-Vue-cli앱 인스턴스는 다음과 같이 생성합니다.createApp({ //최상위 컴포넌트 옵션});생성한 앱 인

3일 전
·
0개의 댓글
·
post-thumbnail

[Vue.js] props

Vue.js에서 props는 부모 컴포넌트에서 자식 컴포넌트로 전달해주는 속성을 의미합니다. props의 사용 이유는 기본적으로 뷰 컴포넌트가 각자 스코프를 가지기 때문에 다른 컴포넌트의 값을 바로 접근할 수 없기 때문입니다.Vue 컴포넌트는 명시적인 props의 선언

3일 전
·
0개의 댓글
·
post-thumbnail

parseInt(0.0000001) == 1

(푸 무서워)parseInt() 파라미터로 주어진 값을 특정 진수의 정수로 반환합니다.이때 진수는 선택사항이며 기본값은 10진수(10)입니다.즉, 정수를 반환하기 때문에 소수점을 넣으면 소수점 자릿수를 버림하고 돌려주죠.그러면 0.00001, 0.000001, 0.00

4일 전
·
0개의 댓글
·
post-thumbnail

소프트웨어 개발 - 요구분석

소프트웨어 개발에서 만들고자 요구하는 사용자는 적은 비용으로 원하는 기능들이 모두 들어가있는 소프트웨어를 만들어주기를 바랍니다.개발자는 이러한 요구사항들을 정확하게 파악해서 원하는 비용에 높은 품질의 소프트웨어를 개발할 수 있어야합니다.소프트웨어 개발에서 요구사항은 사

4일 전
·
0개의 댓글
·
post-thumbnail

MUI 사용하기

MUI(Material-UI)는 Material Design을 구현해놓은 라이브러리입니다. 라이브러리를 연동 후 컴포넌트를 사용하듯이 가져다 조립하면 쉽게 디자인을 할 수 있습니다.간단하게 Material Design이 뭔지 간단하게 이야기해볼까 합니다. MUI를 학습

4일 전
·
0개의 댓글
·
post-thumbnail

[Clean Code] 8장 경계

소프트웨어 개발 과정에서 모든 부분을 개발하게 되는 경우는 드물다. 외부 API나 라이브러리, 패키지, 오픈 소스 등 다양한 도구들을 이용해서 개발을 한다. 이 경우 소프트웨어 간의 경계를 개발한 코드와 깔끔하게 통합시켜야한다.인터페이스의 제공자와 사용자 사이에는 긴장

5일 전
·
0개의 댓글
·
post-thumbnail

[Clean Code] 7장 오류 처리

if 문 등을 활용한 오류 처리 코드보다는 try~catch와 같은 예외 처리 코드를 사용해야한다.if문은 중첩될수록 프로그램 성능도 저하되고, 구조도 복잡해진다. try~catch를 사용해서 예외 처리로 오류 코드와 로직을 분리해야한다.try블록에서 예외가 발생하든

6일 전
·
0개의 댓글
·
post-thumbnail

[Javascript] Array.prototype.sort()와 오름차순 내림차순 정렬

예전에 내장 객체 Array를 소개하면서 메소드인 sort()(https://velog.io/@bami/Javascript-%EB%82%B4%EC%9E%A5-%EA%B0%9D%EC%B2%B4-Arraysort()는 기본적으로 오름차순 정렬을 수행합니다. 그런데

2023년 9월 15일
·
0개의 댓글
·
post-thumbnail

Thanks for inventing Javascript

오늘 가져온 밈짤은 이것입니다.벌써 어질어질하죠? 하나씩 풀어서 해석해보겠습니다.NaN은 숫자가 아님을 의미하는 Number 내장 객체의 프로퍼티입니다.그런데 숫자가 아님을 의미하지만 typeof 연산자를 통해 타입을 확인하면 number 타입으로 나오게 됩니다.이 이

2023년 9월 13일
·
0개의 댓글
·
post-thumbnail

[Typescript] Template Literal Types

오늘 소개할 Template Literal Types는 템플릿 리터럴 문자열을 사용해서 문자열 타입을 생성합니다.자바스크립트의 템플릿 문자열과 동일하게 사용되지만 또 다른 string 리터럴 타입과 함께 사용면 새로운 형태의 string 리터럴 타입을 생성할 수 있습니

2023년 9월 13일
·
0개의 댓글
·
post-thumbnail

[Typescript] 인덱스드 엑세스 타입

인덱스드 엑세스 타입(Indexed Access Types)은 인덱스\[]를 사용해서 객체, 배열, 튜플의 특정 프로퍼티 타입을 추출하는 타입입니다.인덱스로 객체의 프로퍼티 명을 사용하면 간단하게 객체 타입에 접근할 수 있습니다.배열에서는 typeof 연산자와 함께 사

2023년 9월 10일
·
0개의 댓글
·
post-thumbnail

[React] Custom Hooks

기존에 소개드린 useState, useEffect, useCallbak, useRef, useMemo, useReducer는 리액트에서 제공하는 기본적인 Hooks였습니다. 이들만 이용해도 편리하게 리액트 앱을 개발할 수 있습니다.거기에 더해서 리액트에서는 반복되는

2023년 9월 10일
·
0개의 댓글
·
post-thumbnail

[React] useReducer

useReducer는 컴포넌트에 리듀서를 추가할 수 있게 만들어주는 Hook입니다.이 내용은 리액트의 상태관리(https://velog.io/@bami/React-ContextAPI리듀서를 간결하게 요약하자면, 현재의 상태와 상태 업데이트를 위해 필요한 정보인

2023년 9월 9일
·
0개의 댓글
·
post-thumbnail

코딩테스트 문제 풀이 모음 노션

코딩테스트 문제 해답과 풀이에 대한 항목을 노션으로 따로 제작해서 분리했습니다. 당연히 접근성은 블로그가 더 좋겠지만 블로그가 너무 잡다해진다는 느낌을 받아서 따로 분리하게 되었습니다.더 정확하게 말하면, 코딩 테스트 문제가 현재 푼것만 해도 150여 문제이고, 앞으로

2023년 9월 8일
·
3개의 댓글
·
post-thumbnail

[CSS] 애니메이션

이전에 소개드린 transform, transition을 사용하면 웹 페이지에서 애니메이션 효과를 낼 수 있었습니다. 하지만 자연스러운 애니메이션을 만들기 위해서는 두 속성을 잘 조합해야했는데요. 그래서 애니메이션을 쉽게 만들고자 animation 속성이 등장했습니다.

2023년 9월 8일
·
0개의 댓글
·
post-thumbnail

[CSS] transition

이전에 배운 transform은 요소를 이동시키거나 회전시키는 동작을 했습니다. 이번에 다룰 transition은 요소를 웹 요소의 속성을 동작에따라 변경시키는 효과를 낼 수 있습니다.그러면 트랜지션을 사용하기 위한 속성들에 대해 알아보도록 하겠습니다.실습에 사용된 코

2023년 9월 8일
·
0개의 댓글
·
post-thumbnail

웹 접근성

웹 표준(https://velog.io/@bami/%EC%9B%B9-%ED%91%9C%EC%A4%80-%EC%95%8C%EC%95%84%EB%B3%B4%EA%B8%B0웹 접근성은 하드웨어, 소프트웨어, 언어, 장소, 능력, 장애에 상관없이 모든 사람들이 모든

2023년 9월 7일
·
0개의 댓글
·