javascript 25

타입스크립트 타입추론 표적 성능개선 후기 (당근 테크밋업 후기?)

타입스크립트의 타입 추론이 점점 느려져 답답하던 중,당근 테크 밋업에서 소개된 방법으로 타입 추론의 병목 지점을 찾아해당 부분만 수정함으로써 속도를 빠르게 개선할 수 있었어요.그 경험을 정리한 글이에요. 인텔리 센스, 그것이 느려지는 이유인텔리센스는, IDE가 제공하는 코딩 편의기능이에요.코드를 타이핑할 때에 사용할 수 있는 문법들을 보여주고, 타입체크도 해주어 잘못작성한 문법을 지적해 주지요.VSCode(이하 IDE)에서 TypeScript (이하 TS) 기반 개발을 하다 보면,간혹 인텔리센스(IntelliSense)가 느려지는 경험을 할 때가 있어요. IDE의 TS는 코드를 입력할 때마다 TS컴파일러가 코드를 분석하고 타입을 추론해 줘요.이 과정이 실시간으로 이루어지기 때문에, 프로젝트의 코드 규모가..

웹기초 6기 TA 회고

노마드 코더에서 Teaching Assistant로 활동했던 웹기초 6기가 끝났다. 이는 그에 대한 회고이다. 이는 복습을 위한 글도 아니고, 취업시장의 판관에게 제출하기위한 서류도 아니다. 그저 지난 10주 스터디의 기억이 다 스러지기 전에, 그 편린을 모아 간직하고 싶은 소망의 실현이다. # 1. 제안, 승낙 “영진님께 웹기초 TA를 맡아주실 의향이 있으신지 여쭤보려고요.” 보라님의 말씀이었다. 놀라웠다. 나는 커뮤니티 내부에서, 부끄러운 모습을 많이 보였었고 내가 만든 상황을수습하는 주체는 보라님을 비롯한 Crew분들이었다. 그런 내 치부를 모두 관찰한 보라님이 Teaching Assistant 합류에 대한 제안을 하고 계셨다. 더욱이 당황스러운것은, 발화의 태도였다. 그녀는 특별히 선심을 써서 내..

클린코드 7주차: 점진적인 개선

230918클린코드7주차: 14장 점진적인개선 이번 주차에는 14장 "점진적인 개선"을 읽었습니다. 처음에 저자는 명령행 인수 분석을 위한 깔끔한 클래스인 "args"를 보여주고, 깔끔한 클래스가 어떤 지저분한 모양새로 시작헀으며, 깔끔해질 때까지 거친 과정을 볼 수 있었습니다. 14장 점진적인 개선 명령행 인수부터 막혔습니다. 명령행 인수가 무엇인지 몰라서 arg 클래스가 어떤 역할을 하는 것인지 이해하기 어려웠습니다. 찾아보니 자바에서는 한 파일의 코드가 "public void main"으로 선언된 클래스로 시작하고, 해당 main 클래스의 초기화 인수를 편집기나 여러 환경 설정도구를 통해 넣을 수 있다고 합니다. 그 인수가 바로 명령행 인수입니다. public static void main(Stri..

클린코드 6주차: SerialDate 리팩터링, 냄새와 휴리스틱

230912 클린코드 6주 차 클린코드 북스터디를 하며 작성한 독후감 겸 요약글입니다. 이번주에는 16장 Serial Date 리팩터링, 그리고 17장 냄새와 휴리스틱을 읽었습니다. 16장에서는 JUnit에 이어 또 다른 라이브러리 코드를 분석 및 개선하고, 17장은 지금까지 책에서 다룬 기법을 총정리합니다. 이제 책의 거의 마지막 부분을 달려가고 있네요. 최근에 리액트 스터디를 시작해서, 책에서 읽은 기법들을 하나하나 검토하고 개선하여 적용해 볼 생각에 힘이 납니다. 16장 Serial Date 리팩터링 JUnit 들여다보기에 이어서 또 다른 클래스를 리팩터링 하는 쳅터입니다. 리팩터링 대상: David Gilbert - SerialDate Class https://www.jfree.org/jcommo..

클린코드 5주차: 동시성, 그리고 JUnit

230904 클린코드 5주차 클린코드 북스터디를 하며 작성한 독후감 겸 요약글입니다. 5주 차 동안 13장인 "동시성"과 15장 "JUnit 들여다보기"에 대해 읽었습니다. 13장 동시성 동시성 개념과, 동시성 코드를 깨끗하게 작성하는 방법을 이야기합니다. 저는 이 책이 일종의 디자인패턴/소프트웨어 공학적 지식을 다루는 것으로만 알았는데 OS개념이라고 할 수 있는 동시성에 대한 설명이 나와 반갑기도 하고 신기하기도 했습니다. 책을 읽고 보니 사실 동시성이야말로 클린코드에서 다루어야 할 부분이더군요. 일반 싱글 스레드 프로그램보다 코드가 복잡하고, 기상천외한 오류가 많이 발생하기 때문입니다. 이 장의 직접적인 코드예제는 많이 적어서 아쉬웠지만 그래도 동시성 개념에 대한 공부 방향과 테스트 코드 작성 방법에..

프로그래머스 동적계획법: N으로 표현 javascript

문제링크 https://school.programmers.co.kr/learn/courses/30/lessons/42895 함수설명 함수는 두 자연수 N과 number를 입력으로 받습니다. N은 1 이상 9 이하의 수입니다. 숫자 N과 사칙연산만을 사용하여 number를 만드는데 필요한 N의 최소 개수를 반환해야 합니다. 만약 그 수가 8보다 크다면 -1을 반환합니다. 정답코드 const solution = (N, number) => { if (number === N){ return 1 } const memo = [...Array(9)].map(x => new Set()); memo[1].add(N); for (let i = 2; i < 9; i++){ memo[i].add(Number(`${N}`.re..

코딩테스트 2023.08.29

클린코드 2주차: 주석, 형식맞추기, 그리고 객체와 자료구조

클린코드 북 스터디를 하며 작성한 독후감 겸 요약글입니다. 이번주에는 4장 주석, 5장 형식 맞추기, 그리고 6장 객체와 자료구조를 읽고 이야기를 나누기로 했습니다. 4장 주석 첫인상 4장은 신선한 쳅터였습니다. 저는 주석은 코드가 아니라고 생각하고 있었습니다. 그래서 좋은 주석을 작성하는 법에대한 쳅터가 상당히 독특하게 다가왔습니다. 주석은 기껏해야 필요악이다. 저자는 주석을 개발자가 코드로 정확한 의도를 표현하는 것에 대해 실패했을 때 사용하는 필요악으로 묘사합니다. 주석은 거짓말을 한다. 개발자가 코드를 작성할 때 실수를 하는 것처럼, 주석을 작성할 때에도 으레 실수를 합니다. 하지만 잘못 쓰인 주석을 테스트할 수 있는 방법은 없으므로 주석은 때로 거짓말을 하거나 혼란을 줍니다. 주석은 의무적으로 ..

CRM 프로젝트 시작! - 회원가입/권한부여

초록 첫 팀 사이드 프로젝트로 체육관 고객관리 프로그램을 만들게되었습니다. 포지션 및 기술 스택 저의 포지션은 백엔드이고 아직 기술스택은 완전히 정해지지 않았습니다. 익스프레스 및 기타 react 관련 프레임워크로 서버를 설계하게 되었습니다. 게시판의 이용방향 이 카테고리에는 실제 로직을 제외한 개발 기록을 남기겠습니다. 훗날 제가 어떤 고민을 하고 얼마나 성장했는지 돌아볼 수 있는 기록이 되길 기대해봅니다. 현재 진행상황 작업내용 인지 (확인) 라우터 설계를 해야합니다. 첨부파일 ppt 보고 천천히 설계할 예정입니다. / /login 트레이너 회원가입/ 로그인로직을 만들어야합니다. - 유저는 가입창에서 트레이너/회원을 선택 - select 태그의 option value로 트레이너가 전달 - join 컨..

230424/ 스터디 22일차 회고: form의 submit 이벤트

들어가기 앞서: 최근 블로그 포스팅이 뜸해진 이유 그 이유는 노션에 중독되었기 때문입니다.! 노션에 독후감도 쓰고, TIL도 쓰고, 강의 내용도 정리하고 있습니다. 가장 최근에 작성한 독후감: 프로그래머의 뇌 독후감 (notion.so) 하지만 블로그에 다시 돌아왔습니다. 노션은 나 혼자 보거나, 협업을 위한 위키를 만드는 장소이고 블로그의 뿌듯한 요소들을 충족시켜 줄 수 없으니까요. 벌써 10주 스터디의 전반부가 지나가고있습니다. 모여서 책도읽고, 함께 코드를 읽기도하고 보람찬 시간을 보내고 있습니다. TIL Form에 발생하는 submit 이벤트의 기본동작은 웹페이지 이동이다. 그리고 event.preventDefault()로 방지할 수 있다. form 태그는 클라이언트와 서버가 소통하기위한 도구입니..

변수선언식의 왼쪽에도 중괄호{}가 온다! : 구조 분해할당

구조분해 할당: destructuring assignment? 오브젝트의 속성값으로 여러 변수를 초기화 할 때 해당 객체의 구조를 보여주면서, 변수들을 한 번에 선언하는 문법이다. 말로 하면 이해가 안간다. 바로 코드를 보자. const { sockets: { adapter: { sids, rooms}, }, } = wsServer; 위의 코드는 wsServer 객체의 속성인 sockets, 그리고 그 객체의 속성인 adapter의 성분을 sids, rooms 두 변수에 저장하고있다. 아래의 코드와 정확히 같은 기능을 한다. const sids = wsServer.sockets.adapter.sids; const rooms = wsServer.sockets.adapter.rooms; bing gpt에 따..