본문 바로가기

전체 글119

useEffect side effect를 수행할 수 있는 hook 리액트에서의 side effect란? 리액트 컴포넌트 내부에서 데이터를 가져오거나, DOM을 직접 조작하는 것. 해당 동작들은 다른 컴포넌트에 영향을 주거나 렌더링 과정 중에 구현할 수 없는 작업. 2023. 10. 7.
업데이트 해야하는데.. 부트캠프 마지막 과제를 하면서..생판 처음 써보는 nextjs tailwind css 등등을 쓰면서 러닝 커브를 겪느라.. 2023. 9. 26.
프로그래머스 Javascript 코딩 테스트 Lv.0 숨어있는 숫자의 덧셈 문제를 보면 my_string이 매개변수로 주어지고, my_string안의 모든 자연수들의 합을 return하라고 한다. 대신에 연속된 숫자는 ex. 111이면 111이 아닌 1,1,1 이다. my_string에는 숫자만 있는게 아닌 문자와 섞여있는 문자열 형태이고, 처음 이를 해결하기 위해서 정규 표식을 가져다 사용했다. function solution(my_string) { const regex = /[^0-9]/g; const number = my_string.replace(regex, "").split('') const result = number.map(Number) return result.reduce((a, b) => a + b) } 정규 표현식을 사용해서 숫자가 아닌건 모두 찾는 패턴 re.. 2023. 8. 15.
단항 더하기 연산자 문자열인 숫자를 숫자열로 변환하려면 여러가지 방법이 있는데, 오늘은 코테 문제를 풀고, 다른 사람들의 풀이를 보는 도중 이런 방법도 있구나라고 생각했던게 단항 더하기 연산자 이다. 이제까지 parseInt나 parseFloat, Number를 사용했는데 피연산자 앞에 +를 붙이면 피연산자가 숫자가 아니라면 숫자로 변환을 시도한다. const a = "123" console.log(+a) // 123 const b = "hi" console.log(+b) // NaN const c = "123hi" console.log(+c) // NaN 2023. 8. 15.
부트캠프 프론트엔드 및 백엔드 협업 과제 완료_추가 수정 수정한 부분 배포 사이트 : https://team-project-vacation-management.vercel.app/ 협업 과제를 완료했고, 아쉬운 점이 추가적으로 있어서 추가적으로 기능을 구현한 부분도 있고, css 손 본 부분도 있다. 일단 먼저, 연차와 당직을 구분해서 보는 기능이 없어서 체크 박스를 이용해서 기본적으로 연차와 당직을 모두 체크 상태로 해두었고, 연차나 당직 둘 중 하나만 체크를 해서 연차/당직 일정을 구분 할 수 있게 했다. 앞선 부분에서 말한대로 전체 일정과 나만의 일정 스위치를 토글 했을 때도 체크박스 기능은 동작하며, 최소한 하나 이상의 옵션을 체크 해야한다고 경고 메세지가 나오게 하였다. 프로필 이미지 수정 중에 이미지 썸네일을 미리 보기가 안되는 점을 수정하였고, 변.. 2023. 8. 15.
부트캠프 프론트엔드 및 백엔드 협업 과제 완료 배포 주소: https://kdt-5-mini-team-11-eifz.vercel.app/ GitHub: https://github.com/KDT5-MINI-TEAM11/client 참고로 팀 이름은 개쩌는팀 이다 ㅋㅋ 이번 프로젝트를 하면서 공부가 필요한 부분 recoil 등 다른 전역상태관리 라이브러리, axios interceptor 이번 협업 과제가 완료 되었다. 일단 과제를 진행하면서 어려웠던 점은 새로운 라이브러리나 외부 서비스를 사용함에 있어서 영문 Docs를 대충 훑어 넘어가버려서 쉽게 해결 할 수 있던 문제들을 오래 끌었던 점과 원래 프론트엔드 작업 인원은 총 3명이었으나, 한 분이 과제를 진행하는데 있어서 무리가 있을거 같다는 다른 분의 의견에 그분 작업량을 나누고 다른 한 분이 그 분.. 2023. 8. 13.
부트캠프 프론트엔드 및 백엔드 협업 과제 진행 ing (FullCalendar) 연차 및 당직 관리 웹애플리케이션 메인 페이지이다. 달력은 FullCalendar를 사용했다. switch 토글은 ant design { "success": "true", "response": [ { "id": 1, // 스케쥴 id "userName": "Park", "scheduleType": "ANNUAL", "startDate": "2023-08-11", "endDate": "2023-08-13", "state": "APPROVE" }, { "id": 2, "userName": "Jon", "scheduleType": "DUTY", "startDate": "2023-08-20", "endDate": "2023-08-20", "state": "PENDING" } ] "error": null } 일단.. 2023. 8. 9.
부트캠프 프론트엔드 및 백엔드 협업 과제 진행 ing (cloudinary 연결 회고) 코로나 후유증 대단해.. 하루 짧으면 4시간 길면 7시간 정도 자던 나! 하루 14시간씩 자게 만들었음.. 현재 협업 과제 진행 사항은 기능 구현 완료 금일 오후에 다같이 모여서 배포하고, 1차 통합 테스트 거칠 예정 그전에 진행 중에 에러 사항있던 부분 되짚어 보기 먼저 내가 맡은 부분은 회원가입, 메인 페이지에 이벤트가 렌더링될 달력, 마이페이지 나의 일정 관리 회원가입 부분 진행 중에 에러 사항 중 하나는 프로필 이미지 부분, 서버측과 협의하에 프로필이미지 부분을 url로 데이터를 받는 부분이었는데, 이미지 업로드하고 저장되는 부분을 cloudinary를 이용해서 저장된 이미지의 url을 받아왔다. 처음에 cloudinary를 사용할 때 ant design에 있는 upload와 같이 사용하기로 기획.. 2023. 8. 8.

티스토리툴바