티스토리챌린지

React

[React] 근태(출퇴근) 관리 달력 만들기 (with. date-fns)

완성 화면 미리보기프로젝트 생성vite로 프로젝트를 생성했다.react : v18.13.1styled-components : v6.1.13npm create vite@latestcd calendarnpm install  npm i styled-components date-fns 라이브러리 설치date-fns는 JavaScript에서 날짜와 시간 변환등을 다루는데 매우 유용한 도구이다.date-fns : v4.1.0npm i date-fns  Calendar 컴포넌트 만들기 generateCalendar.ts 특정 월의 달력을 생성하는 함수// src/generateCalendar.tsimport { startOfMonth, endOfMonth, startOfWeek, endOfWeek, addD..

React

[Webpack] 웹팩 환경에서 favicon 추가하는 방법

Intro환경 : React + Webpackfavicon 파일 경로 : src/assets/favicon/favicon.ico   HtmlWebpackPlugin을 사용하는 경우HtmlWebpackPlugin 플러그인을 사용한다면 favicon 경로를 설정하는 것 만으로 간단하게 적용할 수 있다. 다만, 단일 favicon만 처리 가능하다.장점: 설정이 간단함장점: 자동으로 favicon을 처리함단점: 단일 favicon만 처리 가능// webpack.config.jsconst HtmlWebpackPlugin = require('html-webpack-plugin');const path = require('path');module.exports = { // ... 다른 설정들 plugins: [ ..

PS (Problem Solving)/Programmers

[프로그래머스] 삼총사 - 자바스크립트

문제https://school.programmers.co.kr/learn/courses/30/lessons/131705 프로그래머스SW개발자를 위한 평가, 교육, 채용까지 Total Solution을 제공하는 개발자 성장을 위한 베이스캠프programmers.co.kr 자바스크립트function solution(number) { const cnt = number.length let answer = 0; for (let i = 0; i

PS (Problem Solving)/Programmers

[프로그래머스] 푸드 파이트 대회 - 자바스크립트

문제https://school.programmers.co.kr/learn/courses/30/lessons/134240 프로그래머스SW개발자를 위한 평가, 교육, 채용까지 Total Solution을 제공하는 개발자 성장을 위한 베이스캠프programmers.co.kr 자바스크립트function solution(food) { let bucket = [] for (let i = 1; i

PS (Problem Solving)/Programmers

[프로그래머스] 가장 가까운 같은 글자 - 자바스크립트

문제https://school.programmers.co.kr/learn/courses/30/lessons/142086 프로그래머스SW개발자를 위한 평가, 교육, 채용까지 Total Solution을 제공하는 개발자 성장을 위한 베이스캠프programmers.co.kr 자바스크립트function solution(s) { let indexHash = {}; let answer = [] for (let i = 0; i

PS (Problem Solving)/Programmers

[프로그래머스] 신고 결과 받기 - 자바스크립트

문제https://school.programmers.co.kr/learn/courses/30/lessons/92334?language=javascript 프로그래머스SW개발자를 위한 평가, 교육, 채용까지 Total Solution을 제공하는 개발자 성장을 위한 베이스캠프programmers.co.kr 자바스크립트function solution(id_list, report, k) { // 신고 횟수 누적 let hash = {} for (const receive of report) { const receiveList = receive.split(' ') if (hash[receiveList[1]]) { hash[receiveList[1]].pu..

PS (Problem Solving)/Programmers

[프로그래머스] 베스트앨범 - 자바스크립트

문제https://school.programmers.co.kr/learn/courses/30/lessons/42579 프로그래머스SW개발자를 위한 평가, 교육, 채용까지 Total Solution을 제공하는 개발자 성장을 위한 베이스캠프programmers.co.kr 자바스크립트function solution(genres, plays) { // 재생 횟수 저장 let playList = {}; for (let i = 0; i b.max - a.max) // 장르별 재생 횟수가 많은 곡 선택 answer = [] for (const genre of sortedGenres) { // 장르 안에서 재생 횟수가 많은 곡 순으로 Sorting const..

PS (Problem Solving)/Programmers

[프로그래머스] 오픈 채팅방 - 자바스크립트, 파이썬

문제https://school.programmers.co.kr/learn/courses/30/lessons/42888?language=javascript 프로그래머스SW개발자를 위한 평가, 교육, 채용까지 Total Solution을 제공하는 개발자 성장을 위한 베이스캠프programmers.co.kr 자바스크립트function solution(record) { // 객체에 Key Value를 통해 user의 정보를 등록 또는 변경 let userDb = {}; for (const event of record) { const eventList = event.split(' ') if (eventList[0] === "Enter" || eventList[0] === ..

라이브러리

[TypeDoc] TypeDoc으로 TypeScript 프로젝트 문서화 하기

Intro 프로젝트를 진행하면서 jsdoc을 활용해서 코드 주석을 작성하고 있었다. 문서화를 위해 문서 생성을 시도했지만 타입스크립트 변환이 일부 실패하면서 타입스크립트 문서화에 적합한 라이브러리를 찾아보던 중 TSDoc 와 TypeDoc 라이브러리를 알게 되었다.  TSDoc공식 사이트 : https://tsdoc.org/NPM : https://www.npmjs.com/package/@microsoft/tsdoc깃허브 : https://github.com/microsoft/tsdoc  조사해보니 TSDoc은 Microsoft가 제안하고 주도하는 오픈 소스 표준으로, TypeScript 코드의 주석을 문서화하기 위한 스타일 가이드를 제공한다고 한다. 나는 타입스크립트 기반의 주석을 잘 문서화시킬 수 있..

캐럿노트
'티스토리챌린지' 태그의 글 목록