개요 스택오버플로우를 클론 코딩하는 Pre-project 팀 과제를 진행하던 중, 질문 상세 페이지와 수정 페이지, 답변 수정 페이지에서 중복되는 코드가 많이 발생하였다. 질문 등록 페이지 AskQuestion function AskQuestion() { const [titleValue, setTitleValue] = useState(""); const [bodyValue, setBodyValue] = useState(""); const submitHandler = (e: React.FormEvent) => { e.preventDefault(); setBodyValue(""); }; return ( Ask a public question submitHandler(e)}> Post your question..
CSS 개발 방식 CSS-in-CSS 렌더링할 때 모든 CSS 요소를 로딩하기 때문에 인터렉티브한 웹 페이지를 구성할 때 사용자 편의를 반영하기 좋다. CSS-in-JS 해당 컴포넌트가 렌더링 될 때만 스타일 태그를 생성하기 때문에 컴포넌트 기반 프로젝트에 유용하다. 각 컴포넌트의 라이프 스타일에 맞게 스타일을 적용할 수 있고 자바스크립트 코드를 활용할 수 있기 때문에 동적 스타일 적용이 자유롭다. 자바스크립트 해석 과정이 필요하기 때문에 CSS 모듈 방식에 비해 성능이 느리다. CSS 라이브러리 CSS-in-CSS 종류 CSS-module CSS를 모듈화하여 사용하는 방법 기본적으로 CSS 클래스의 범위가 정해져있다는 점에 대한 이점은 CSS-in-JS와 동일하지만 순수 CSS 파일을 유지하기 때문에 ..
패키지 매니저란? 프로젝트가 의존하고 있는 라이브러리와 같은 패키지들을 설치하고 관리할 수 있도록 도와주는 프로그램이다. 아무리 간단한 프로그램이어도 수십개 이상의 다른 패키지들에 의존하게 되고 이 패키지들은 빈번하게 업데이트 되기 때문에 패키지 매니저를 통해 일괄 관리할 필요가 있다. 패키지 매니저 비교 npm(Node Package Manager) Node.js의 표준 패키지 매니저로 Node.js를 설치하면 자동으로 설치된다. npx(Node Package Runner) npm에서 제공해주는 도구 프로젝트에 영구적으로 필요한 의존성 패키지나 개발 의존성 패키지들이 아니라, 특정 환경을 구성하거나 특정 작업을 수행하는 시점에만 필요한 패키지들을 설치하고 실행한 후 삭제 과정을 자동으로 진행해주는 도구..
로깅(Logging) 로깅이란 시스템이 동작하는 동안의 시스템의 상태, 동작 정보 등을 기록하는 것이다. 이것을 통해 애플리케이션의 문제를 진단할 수도 있고 데이터를 수집하여 분석 자료로써 활용할 수 있다. 로깅 구현체 대표적으로 Log4j와 Slf4j의 구현체인 Logback이 있다. Log4j는 가장 오래된 자바 기반 로깅 프레임워크이며 Logback은 Log4j의 아키텍처 기반으로 재작성된, 스프링부트에 기본적으로 포함된 로깅 프레임워크이다. Logback Log4j에 비해 향상된 필터링 기능, 로그 레벨 변경 등에 대해 서버를 재시작할 필요없이 자동 리로딩을 지원한다는 장점이 있다. 로그 레벨 Logback은 5단계의 로그 레벨을 가진다. 로그는 설정 레벨과 설정 레벨 상위의 로그만 추적한다. (..
타입스크립트의 Interface 자바의 인터페이스가 추상 메소드를 가지면서 설계와 구현을 분리하기 위한 기능이라면, 타입스크립트의 인터페이스는 객체를 위주로 다루면서 그 객체의 타입을 정의해놓은 설계도라고 할 수 있다. interface Fruit { name: string; price: number; } interface명은 첫 글자를 대문자로 한다. // 객체의 타입을 인터페이스로 지정 const fruit: Fruit = { name: mango; price: 1000; } // 매개변수의 타입과 반환타입 또한 인터페이스로 지정할 수 있다. function selling(item: Fruit): Fruit { // ... } 인터페이스 & 타입 별칭 인터페이스와 type alias는 객체 구조 타입..
- Total
- Today
- Yesterday
- 정렬
- DP
- Queue
- Algorithm
- Nest
- 자바bfs
- Comparator
- Spring
- CS
- 자바스크립트
- BFS
- 타입스크립트
- 이분탐색
- JPA
- 백준
- 해시맵
- 자바dp
- 자바트리
- 스프링
- SQL
- 리액트
- 자바
- SQLD
- 프로그래머스
- dfs
- JavaScript
- 알고리즘
- java
- 스프링부트
- 형변환
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 |