일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
- domain
- useRouter
- git
- 스파르타코딩클럽
- CORS
- 코드카타
- vscode
- array정적메서드
- deep dive
- 모던자바스크립트
- 프로그래머스
- error
- 자주 까먹는
- 소셜 로그인
- 코딩테스트
- 프로젝트 셋팅
- 티스토리챌린지
- 셋팅
- 구글 로그인
- 내일배움캠프
- Next
- js
- 초기셋팅
- 오블완
- 모던 자바스크립트
- nextjs
- React
- 코테
- 최적화
- vercel
- Today
- Total
목록Today I Learned (108)
도록
지난 11월에 프리랜서 계약을 해 3개월동안 일한 후기를 적고자 한다. 선택 배경나는 프리랜서 계약이 처음이다.프리들은 금액이 높은 대신 세금 너무 많이 내서 힘들어! 라는 후기들이 진짜인지 궁금했다. + 근로소득자와 사업소득자의 세금 계산이 궁금했다. + 어떤 것을 고려하면서 프리랜서 계약을 해야하는지도 알고 싶었다. 요약중개 서비스를 이용할 거라면, 계약서와 서비스 이용약관을 잘 보자! (내가 이용한 서비스의 이용약관) 후기보수 지급일을 조정할 수 있다. (특정 달 보수를 15일 정도 이후에 받고 싶다는 의사를 표했고, 계약서에 이 내용을 반영해 원하던 시점에 보수를 받았다.)중개 서비스와 발주사 간의 금액은 내가 알 수 없다.내가 원하는 최저 보수를 중개서비스에 전달하면, 발주사와 조정해 최종 금액..
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/cnTkIR/btsMf5mc6rH/XWYMm9IGtrsIEYtwbJBEsk/img.png)
연결 방법1. 키보드 유선 연결2. https://usevia.app/ 사이트 접속 후, 4번째 setting 탭에 들어간다3. 첫번째 탭인 키보드 모양의 configure 메뉴에서 authorize device 클릭해, via 설정할 키보드를 선택합니다. 키 맵핑 하는 방법은 키크론이 잘 설명해주기에, https://keychron.kr/via/?vid=12 요 페이지 보면서 하면 된다. ⚠️ 아무리 권한을 줘도 configure 탭에 아무 반응이 없다면?1. via json 파일을 다운받기usevia.app에서 지원하지 않는 키보드를 설정하기 위해, 여기(https://epomaker.com/blogs/via-json/cidoo-abm066-usb-via-json-file?_pos=3&..
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/byyDtg/btsL5sJcHpg/5OqeExzFrCrYPkdBDD7oW0/img.png)
머리 속 정리하기. 전문 용어 번역기를 주제로 사이드 프로젝트를 하려고 한다. 개발 전 미리 머리 속을 정리하고자 한다. Why : 주제 선택의 계기는?: 지인이 건강검진에서 의심되는 병이 있어, 여러 검사를 받게 되었다. 그 검사 결과지에 적혀있는 글을 이해하기가 어려웠고, 내용을 이해하기 위해서는 다음 병원 방문일까지 기다려야 했다. Pain point : 전문 용어는 어렵다.'어렵다'라는 단어가 공부할 때 많이 들어서 그런지, 생각할 겨를도 없이 '쉽게, 혹은 즐겁게!' 가 튀어나왔다.그치만 전문용어를 달달 외울 것도 아닐 뿐더러, 공부하는 것이 목표가 아니다. 공부보다는 커뮤니티 정도로 가벼웠으면 좋겠다 였다.내가 모르는 것을 잠깐 검색, 질문을 통해 해결하고 이러한 행위는 커뮤니티와 유사한 ..
정의사용자의 현재 화면에 보이지 않는 영역은 렌더링을 건너뛰는 속성이다.이를 통해 초기 페이지 로드 시간을 단축해, 사용자 경험을 개선할 수 있다. 사용 방법우선 각 영역을 section으로 나누고, 나누어진 섹션에 아래 css을 적용시킨다.content-visibility: auto; // 브라우저에게 해당 요소가 현재 뷰포트에 보이지 않을 때 렌더링을 건너 뛰기contain-intrinsic-size: 1000px; // 스크롤바가 올바르게 뜨기 위해, 요소의 예상 크기를 설정 conetent-visibility가 가질 수 있는 값의 종류는?- visible : 아무런 효과 없음- hidden : 요소 생략 (dispaly:none처럼, 페이지 내 찾기/user-agent 접..
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/4pYLp/btsLtcURNWr/qIO1nTw3yZN3TZQdgm8MEk/img.png)
WebSocket만 써보고 SockJs는 처음 써보기에, 하나씩 기록해보려 한다. 1. install sockjs-clientyarn add sockjs-client @types/sockjs-client 2. socket 연결부의 예제 코드 추가import React, { useEffect, useRef, useState } from 'react';import SockJS from 'sockjs-client';const SocketTest = () => { const [messages, setMessages] = useState([]); const socketRef = useRef(null); useEffect(() => { socketRef.current = new SockJS('서버주소..
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/LzNdy/btsLefefvNG/ns2mq7E2KxUcm2d45mcDu1/img.png)
문제 상황- tailwind css 공식문서에서 하라는 대로 했지만, tailwind가 적용되지 않아 브라우저에서 보면 스타일이 다 깨져있다.더보기참고) 나의 개발 환경은...- vite, react, typescript, scss 를 사용하고 있다. (sass를 tailwind로 교체 중)- local 은 vite를 사용해 테스트하고, dev, prod 는 express 서버를 이용한다.- ci 는 jenkins, docker 파일을 이용해 구현되어 있으며, install 과 build가 분리되어 있으며, 서버를 내리지 않고 container 교체 방식으로 진행된다. 우선 어디가 문제인지 보자⬇️결론은 맨 아래 ⬇️ 왜 스타일이 깨질까? 생각해 아래와 같은 가설을 만들었다.[가설 1] tailwin..