| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 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 | 29 | 30 | 31 |
- 타입스크립트
- spring boot
- 큐넷
- 리액트
- Front-End
- VUE
- Node.js
- security
- 자바스크립트
- React
- Redux
- 백엔드
- spring boot security
- useState
- 수제비
- JWT
- It
- frontend
- 백엔드개발자
- 프론트엔드
- spring
- TypeScript
- 웹개발자
- JavaScript
- 스프링부트
- 정보처리기사
- Authentication
- TS
- 정보처리기사 실기
- JS
- Today
- Total
목록Front-end (39)
솔적솔적
너는 if문을 왜 그렇게 써?그리고 중첩된 else if, 왜 좋지 못한 코드를 쓰는거야?switch문을 사용할 생각은 없는거야? 여기에서 아, 내가 급하게 기능 구현만하려했었다라는 반성 연이어,협업 시 팀원의 분노게이지를 상승시키지않을만한 좋은 코드란 것에 대해서 돌이키며 유념하고자 정리하는 글이다. 소프트웨어에서 기본 원칙이나 클린 코드 등 책들을 읽으며 알았던 좋은 코드에대해서 정리해보면, 코드를 읽는 사람이 쉽게 이해할 수 있어야하는 “가독성” ⇒ 변수명, 함수명, 들여쓰기, 구조가 직관적이어야한다Readability ⇒ 읽기 쉬운가? 코드 수정이나 기능 추가 시 다른 부분에 영향을 최소화해야하는 “유지 보수성”Maintainability ⇒ 고치기 쉬운가? 중복 코드 제거, 모듈화, ..
오늘의 글은window.location.reload()가 위험할 수 있는 이유와,React 프로젝트에서의 더 좋은 새로고침 전략에 대해서 정리해보고자한다. 버튼 클릭 시 “새로고침”이 필요하다는 요구사항을 종종 만납니다. 흔히 떠올리는 건 바로window.location.reload();하지만, 구현하면서 항상 생각해야한다.이 코드가 우리 프로젝트에 적합한 코드인가? 왜 섣부른 전체 리로드가 위험할까 🤔상태 손실이 되어도 괜찮은가: 메모리 기반 상태(React state, Zustand 등 사용 시) 전부 초기화된다.현재 참여 중인 프로젝트는 i18n을 적용해 한국어/일본어 다국어 선택 기능을 제공하고 있는데,단순히 window.location.reload()를 사용하면 이 상태들도 모두 초기화..
사이드 프로젝트 '같이행' 퍼블리싱 작업 중 프로필 수정 클릭 시 모달이 나오는 형태인데, 이런 에러가 나왔다. 해석하면 보통 한 요소를 다른 요소 안에 중첩하려고 할 때 발생하고. HTML은 이러한 중첩을 허용하지 않는다고 한다. 추측되기론, EditProfileModal.tsx 안에 있는 button요소가 중첩되어 에러를 내는 것같다. 혹시 이전에 만든 공통 컴포넌트에서 전달하는 props 타입이 이상한 것이 아닐까 먼저 확인해보기linkText의 타입은 이상이없는 것같고, 사실, button이 중첩된다하면 간단히 button인 태그를 다른 태그로 바꾸면된다.허나! 직접 DOM 이벤트를 사용하는 경우 TypeScript가 정적분석하기 어려워 핸들러의 타입을 추론하지 못해, 빨간줄이 팍!나올..
월간CS에서 1주차 react, next 배포, 배포 자동화 A부터 Z까지 수업을 참여하였습니다.직접 실습하며 배웠던 내용, 실습 중 막혔던 부분과 해결과정들을 적어보려합니다. 👉 CI/CD란? 링크 클릭👉 GitHub Flow 전략에 대한 이해 링크 클릭👉 GitHub Action에 대한 이해 링크 클릭 🍖 CloudFront, S3 배포하기 👉 aws cli 링크 클릭 👉 terraform 링크 클릭 🍖 terraform이란?클라우드 인프라스트럭처 자동화 도구인프라를 구축, 변경, 버전관리위한도구로 코드로 인프라를 관리할 수 있게 한다. 🍖 Github Actiongithub action용 폴더를 만들고 꼭! .github > workflows > .yaml 순으로 생성해야한..