👱♂️간헐적 회고 나 요새 뭐했냐 회사 합격 후 출근을 위해 여러가지 준비를 하고 있다. 출근은 9월 18일부터 하기로 하였는데 가장 큰 문제는 평생을 한 집에서 살아온 내가 이사를 해야한다는 것 회사에서 집 구하는 것에 도움을 주어서 약간 걱정을 덜긴 했지만 2x년 간 쌓아둔 생활 기반을 모두 버리고 자취해야하는 게 가장 큰 고민이다. 비싸지 않고 무거운 짐들은 이사 후 택배로 구매할 생각이지만 하나하나 전부 다 새로 사는것보다는 챙겨갈 건 챙겨가는게 경제적일 것 같아서 뭘 챙겨갈지, 어떤 방식으로 옮길지를 고민하고 있다. 그와 별개로도 지금 살고 있는 집은 어릴적 가구들을 버릴수가 없어서 내 취향이 100% 반영되지는 못한 상태였는데 자취를 시작하게되면 집의 많은 부분들을 내 취향에 맞게 만들 수 ..
😉6개월 간의 교육과정을 끝마치고 이 과정을 듣고 싶거나 고민하고 있는 사람에게 도움이 되었으면 좋겠습니다. 이 글은 내가 코드스테이츠를 선택한 이유, 알아두면 좋은 것, 장점 , 단점 , 중도하차자, 취업 현황 , 나의 후기, 추천 여부 순으로 서술합니다. 😉내가 코드스테이츠를 선택한 이유 우선 제가 개발자가 되기 위한 준비를 시작한 것은 작년 9월 초부터 입니다. 그 이전에는 대학교 교양 강의로 파이썬을 해보고 , html / css를 간단하게 다루어본 것이 전부였습니다. 제 공부흐름을 정리하면 1. 10월 ~ 11월 제로베이스 프론트엔드 스쿨 (중도하차) 2. 11월 ~ 2월 독학 3. 2월 ~ 8월 코드스테이츠 프론트엔드 44기 (수료) 입니다. 따라서 코드스테이츠 과정을 들어가기 이전에도 어느정..
🤕 시작하며 이 글을 작성하기 전에 구글, 벨로그 등에 "프론트엔드 개발자 취업 후기"와 같은 키워드로 검색을 해보았습니다. 제 검색 실력이 미천한 탓도 물론 있겠지만 노출되는 대부분의 게시물들이 2022년 이전에 작성된 것이었음을 확인했습니다. 분명 많은 사람들이 궁금해할만한 키워드일텐데..라고 생각이 들어 글을 작성해봅니다. 저는 최근 채용과 입사날짜가 확정되었고 현재 출근을 위해 여러가지 준비(이사...라든지.. 회사 스택 공부라든지..)를 하고 있는 상태입니다. 제 이력을 짧막하게 작성하면 이렇습니다. 비전공자 남자 20대 부트캠프 수료 그리 흥미로운 정보는 아니겠지만 수료한 부트캠프는 코드스테이츠입니다. 코드스테이츠와 관련된 정보가 궁금하면 아래 회고를 참고해주세요 https://xionwcfm..
🙄 그런데 Private, Protected 가 뭘 하는지 아시나요? protected는 조금 생소한 개념이어서 저는 조금 감이 안잡혔던 경험이 있습니다. 간단하게 정리하고 가면 public 어디에서나 접근 가능하며 접근제어자를 따로 정의하지 않으면 설정되는 default 값입니다. private private 키워드로 선언된 프로퍼티들은 서브 클래스에서도 접근할 수 없습니다. 타입스크립트는 인스턴스 간 private 액세스를 허용합니다. class A { private x = 10; public sameAs(other: A) { // No error return other.x === this.x; } } 이렇듯 classA는 sameAs 를 통해 간접적으로 private 키워드의 정보에 접근할 수 있습..
😖먼저 display none과 hidden의 차이점은? 맨 하단의 레퍼런스 칸에서 mdn이 제공하는 예제를 직접 보는것도 이해에 도움이 됩니다. 우선 둘의 공통점은 다음과 같습니다. 두 속성 모두 특정 엘리먼트를 시야에서 보이지 않도록 처리하는 데에 사용하게 되는 속성입니다. 바닐라 css 에서의 사용례는 다음과 같습니다. .hidden-visible { visibility: hidden } .hidden-display { display: none } 두 속성 모두 내 시야에서 dom 요소를 보이지 않게 처리해줍니다. 둘의 차이점은? display:none 레이아웃에서 요소를 완전히 제거하고 공간을 차지하지 않습니다. 주변 요소에 영향을 주지 않습니다. visibility: hidden 이 경우 요소는..
컨트롤러는? 웹 애플리케이션에서 컨트롤러는 외부의 요청을 처리하는 모듈을 의미합니다. 하나 이상의 클라이언트가 보내는 요청을 처리하고 요청을 보낸 클라이언트에게 응답을 반환하는 역할 이라고도 표현할 수 있습니다. 컨트롤러의 목적은 애플리케이션에 대한 특정 요청을 수신하는 것에 있습니다. 라우팅 매커니즘은 어떤 컨트롤러가 해당 요청을 처리할지를 조정하는 역할을 합니다. 보통은 각 컨트롤러는 하나 이상의 경로가 있고 각기 다른 경로는 각기 다른 행동을 수행합니다. 프로바이더 프로바이더는 nest의 기본 개념으로 서비스, 레포지토리, 팩토리, 헬퍼 등등이 프로바이더로 취급될 수 있습니다. 프로바이더의 주요 아이디어는 의존성 주입 (DI) 입니다. 제어의 역전 , 의존성 주입은 익숙한데 계층형 구조(Layerd..
shadcn/ui https://ui.shadcn.com/docs Introduction Re-usable components built using Radix UI and Tailwind CSS. ui.shadcn.com shadcn/ui는 Radix UI와 tailwindcss를 기반으로 빌드된 컴포넌트 모음집입니다. toast와 같은 ui 기능들은 Radix ui 에서 가져와 사용하고 tailwindcss와 내부적으로는 tailwind-merge , clsx, cva를 이용하여 즉시 사용할 수 있는 아톰컴포넌트들을 제공합니다. tailwindcss 계의 mui 같은 느낌이라고 생각할 수도 있을 것 같네요 다만 nodemodules에서 컴포넌트들이 관리되는 것이 아니라 커스터마이징이 훨씬 간편하다는 장..
이펙티브 타입스크립트 https://product.kyobobook.co.kr/detail/S000001033114 이펙티브 타입스크립트 | 댄 밴더캄 - 교보문고 이펙티브 타입스크립트 | 타입스크립트는 타입 정보를 지닌 자바스크립트의 상위 집합으로, 자바스크립트의 골치 아픈 문제점들을 해결해 준다. 이 책은 《이펙티브 C++》와 《이펙티브 자바》 product.kyobobook.co.kr 위 링크로 구매하셔도 저에게 아무런 이득이 없구요 그냥 어디서 샀는지 보여드립니다. 스터디를 목적으로 구매한 책이었는데 내용 같은 경우에는 서점에서 한번 슥 흝어봐서 대략적으로 이해는 하고 있었습니다. https://github.com/XionWCFM/effective-typescript-study GitHub - X..
😎next.js13 app router tailwind ts mui를 한번에 하는 starter kit이 있다? https://github.com/mui/material-ui/tree/master/examples/base-next-app-router-tailwind-ts 그것은 공식 레포의 examples이었구요 마침 app 라우터에서도 mui를 쓰고싶었는데 앱라우터도 스테이블이 된지 꽤..시간이 되었단 생각이 들어서 혹시 공식 레포에 보일러플레이트가 올라와있지 않을까? 하는 기대로 봤더니 있더라구요... 초기 환경 세팅은 고통스럽기만 하고 어... 해보면 쓸모가 있긴한데.. 고통스럽죠.. https://github.com/XionWCFM/vite-mui GitHub - XionWCFM/vite-mui:..
😊타이핑 효과? 마치 글씨를 쓰는 것 처럼 글자가 한글자씩 출력되는 효과라고 제가.. 정의했습니다. 웹 포트폴리오를 준비하고 있었는데 타이핑 효과가 있으면 재미있을 것 같다. 라는 생각이 들어 타이핑효과를 간단하게 준비해봤습니다. 그냥 코드만 보는 것도 좋지만 그런 게시물은 이미 충분히 많다고 생각하기때문에 이 글에서는 만들면서 하게 된 고민들을 하나씩 톺아보도록 하겠습니다. 😉 기능 정의 및 요구사항 1. 글자는 한글자씩 차례대로 출력되어야한다. 2. 만약 출력된 요소들이 사용자의 시야에서 사라진다면 글자는 0으로 초기화된다. 3. 다시 사용자의 시야에 글자 요소가 보이면 처음부터 글자를 출력한다. 4. 글자의 출력속도는 개발자가 컨트롤 할 수 있어야 한다. ** 성능 최적화를 고려할 것 제 나름대로 ..
