ziglog

    Search by

    11월 3주차 기록

    November 19, 2023 • ☕️ 4 min read

    인생 최대 고비 한 주


    배워가기

    html input inputmode

    사용자가 요소나 요소의 콘텐츠를 편집할 때 입력할 수 있는 데이터 유형의 힌트를 제공하는 열거형 특성이다. 가능한 값은 none, text, decimal, numeric, tel, search, email, url 이다.

    🤔 input type과 다른 점은?

    • type은 input에 들어갈 값의 패턴을 지정한다. validation 목적으로도 사용한다.
    • inputmode는 User Agent에 따라 사용자에 노출되는 키보드의 타입을 지정한다.

    Ref https://developer.mozilla.org/ko/docs/Web/HTML/Global_attributes/inputmode

    @*media* (hover: hover)

    디바이스 pointer로 hover가 가능한 경우에만 스타일을 적용한다. 실제 PC에서는 정상적으로 동작하며 모바일에선 hover에 대한 처리가 이루어지지 않는다.

    Ref https://choi-jinwoo.github.io/post/development/css-media-hover/

    모노레포 changeset

    모노레포 사용 시 changeset 을 이용해서 버저닝을 관리할 수 있다.

    pnpm changeset pre 명령어를 통해서 prerelease도 가능하다.

    Ref https://github.com/changesets/changesets/blob/main/docs/prereleases.md

    gitlab workflow predefined variables


    이것저것

    • 크롬 개발자도구에서 각종 요소들에 대해 badge를 선택해 볼 수 있다. Elements 탭에서 아무데서나 우클릭 후 Badge Settings를 선택하여 커스텀할 수 있다.
    • no-relative-folder-imports - absolute import path를 갖도록 강제한다 (Ref)
    • 디렉토리 용량 확인 명령어
      Copy
      du -hs <path>
    • MP4 파일 명세는 Apple의 QuickTime 파일을 기반으로 작성됐다
    • input위 accept는 믿을 수 없다
    • 부분 깃 클론 할 수 있는 코드 (depth는 가지고올 커밋의 갯수)
      Copy
      git clone --depth=1 --filter=blob:none --no-checkout /your/repository/here /destination/path
    • Array.prototype.reduce도 제네릭으로 타입 선언이 가능하다.
      Copy
      reduce<U>(callbackFn: (previousValue: U, currentValue: T, currentIndex: number, array: T[]) => U initialValue: U): U;

    기타공유

    microsoft intellisense

    이름이 inshellisense? 특이하당.

    shell에서 IDE 스타일로 자동완성을 지원해준다고 한다.

    이런거 많은데. 대기업에서 뒷북 쳤네! 🙃

    Ref https://github.com/microsoft/inshellisense

    makereal

    재미있는 한 트윗 프론트 개발자들은 대체 어디까지 가는건지!

    Ref https://makereal.tldraw.com/

    크롬 한 탭만 음소거하는 익스텐션

    딱히 생각 안해봤는데 필요했잖아!

    게다가 만드는 법도 그리 어렵지 않았을 것 같다

    Ref https://chrome.google.com/webstore/detail/tab-muter/bnclejfcblondkjliiblkojdeloomadd

    vite 5.0

    어디까지 가는거야!

    다음과 같은 주요 변화들이 있다고 한다.

    • Vite는 이제 Rollup 4로 동작한다
    • CJS Node API는 deprecated되었다.
    • defineimport.meta.env.\* 교체 전략의 부활
    • SSR 외부 모듈 값들의 운영 매칭
    • worker.plugins의 함수화
    • .을 포함하는 경로는 index.html fallback으로 떨어지도록 허용
    • dev와 preview HTML 서빙 동작을 맞춤
    • .vite 디렉토리에서 Manifest 파일 기본 생성
    • CLI shortcuts을 사용하려면 엔터키를 눌러야 함
    • experimentalDecoratorsuseDefineForClassFields 타입스크립트 동작 개선
    • --https 플래그와 https: true 제거
    • resolvePackageEntryresolvePackageData API 제거
    • deprecated된 API 제거

    Ref https://vitejs.dev/blog/announcing-vite5


    마무리

    인생 최대 무리를 한 일주일이 아니었을까…

    인생 첫 컨퍼런스 발표 + 인생 첫 자취라니.

    다 끝나면 잠이 잘 올 줄 알았는데 여전히 불면증에 시달리는 중

    몸도 아슬아슬하게 버티고 있는 느낌이다.

    우아콘 후기도 따로 써야 하는데. (안 쓸 것 같다 ㅎㅎ)

    그동안 소홀히 했던 밀린 일들도 해야 한당. 꺅!


    Relative Posts:

    11월 4주차 기록

    November 25, 2023

    11월 2주차 기록

    November 10, 2023

    zigsong

    지그의 개발 블로그

    RotateLinkImg-iconRotateLinkImg-iconRotateLinkImg-icon