개발 성장 일기

아래 내용은 전부 내가 직접 결제해서 수강해본 뒤 느낀 개인적인 의견이다사람마다 성향과 학습 방식이 다르기 때문에 정답이라고 보긴 어렵다 프론트엔드 공부하면서드림코딩, 인프런 한입크기 시리즈, 애플코딩까지 직접 결제해서 수강했다(유데미도 들었지만 완강은 못 했다ㅠㅠ 이건 다음 포스트에 쓸 예정!) 광고가 아니라, 실제로 완강해보고 느낀 차이를 정리해본다 🔎 각 강의별 자세한 후기는 아래에서 확인 가능 - 드림코딩 완강 후기 보러가기 드림코딩 완강 솔직 후기｜내돈내산 리얼 리뷰드림코딩 인강 수강 후기🎓프론트엔드 독학하면서 가장 많이 들은 인강 플랫폼 중 하나가 드림코딩이다.리액트, 자바스크립트, 타입스크립트, 브라우저 동작 원리까지 한 번에 정리하고 싶어bom-na.tistory.com- 인프런 한입..

[이 링크를 통해 구매하시면 제가 수익을 받을 수 있어요. 🤗]※ 본 글에는 제휴 링크가 포함되어 있다. 다만 해당 강의들은 모두 직접 결제하여 수강한 내돈내산 후기이다. 개발 강의 중 비교적 최근에 수강한 강의가 인프런 한입크기 시리즈였다.Next.js를 먼저 수강하였고 만족도가 높았기 때문에 이후 TypeScript와 React 강의를 추가로 결제하여 복습 및 개념 보충 목적으로 수강하였다. 들었던 유료 강의 중 개인적인 만족도는 1위였다. 📌 수강 강의한입크기 Next.js한입크기 TypeScript한입크기 React* Next.js 강의를 먼저 수강하였고, 이후 개념을 더 단단히 정리하고 싶어 TypeScript와 React 강의를 추가로 들었다. ✅ 전체적인 총평한입크기 시리즈는 시각적 자..

프론트엔드 공부하면서 애플코딩 강의도 완강했다.들었던 유료 강의들 중 가장 난이도가 낮았고, 전체적으로 가볍고 빠르게 들을 수 있는 강의였다.결론부터 말하면:입문자가 “프론트엔드 찍먹”하기엔 괜찮다.하지만 깊게 공부하거나 이 강의 하나로 끝내기엔 부족하다. 📌 수강 당시 느낌애플코딩은 전반적으로 설명이 쉽고 빠르다.난이도가 높지 않아서 부담 없이 들을 수 있었고,강의 흐름도 지루하지 않았다.실제로 들었던 강의 중에서는체감 난이도가 가장 낮았다. 👍 장점유튜브나 이벤트를 통해 쿠폰을 자주 뿌림 → 할인받으면 가성비 괜찮음설명이 쉽고 직설적이라 이해하기 편함전체 흐름을 빠르게 훑기 좋음프론트엔드가 어떤 건지 감 잡기에 좋음강의가 비교적 재밌는 편입문자가 부담 없이 시작하기에는 확실히 진입장벽이 낮다. ..

드림코딩 인강 수강 후기🎓프론트엔드 독학하면서 가장 많이 들은 인강 플랫폼 중 하나가 드림코딩이다.리액트, 자바스크립트, 타입스크립트, 브라우저 동작 원리까지 한 번에 정리하고 싶어서 여러 강의를 수강했다.처음에 유튜브 강의를 듣다가 강의 퀄리티가 좋아보여서 결제를 하게 되었다 (이게 총 얼마야 내돈...) 결론부터 말하면: 개념 정리용으로는 확실히 좋다.하지만 이 강의 하나로 실력이 완성되는 구조는 아니다. 수강한 강의 목록🧷 *추천자바스크립트 마스터리자바스크립트를 이론적으로 배우기에 정말 좋았다.기술 면접 대비용으로도 도움이 많이 되었고, 기초 개념을 단단하게 잡아주었다.프론트엔드 필수 브라우저 101Web API, DOM, 디버깅 등 브라우저 전반을 다룬 강의였다. 특히 성능, 이벤트 루프..

강의 개요🎓이번에 수강한 강의는 스파르타코딩클럽 내일배움캠프 웹 프론트엔드 개발 과정이다국비지원(내일배움카드)으로 수강했고, 비전공자도 따라갈 수 있는 커리큘럼이라고 해서 신청했다.목표는 프론트엔드 기초 + 실전 프로젝트 경험을 쌓는 것* 참고로 수료한지 1년됐습니당-!커리큘럼 & 강의 구성📚기초 : HTML, CSS, JavaScript심화 : API 연동, 비동기 처리, 간단한 최적화프로젝트 : 개인/팀 프로젝트 진행기타 : Git, Github 협업, 코드 리뷰단순 이론 강의가 아니라, 거의 매 챕터마다 과제가 있고 직접 구현해보는 방식이라 손에 익히기 좋았다!좋았던 점👍이론 → 실습 → 과제 흐름이 명확해서 따라가기 쉬움비전공자 기준으로 튜터님들의 설명이 친절한 편API 연동, 팀 프로젝트 ..

지도 api는 그동안 카카오,네이버,구글을 많이 봐서 친숙했는데, 회사에서는 Mapbox API + Mapbox GL JS를 사용하여 드론을 띄운다! 익숙해질 수 있게 사수분이 과제도 내주셨지만, 결국 해결하지못해서 매번 사수분이 힌트를 알려주셨다ㅠㅠ   Mapbox API Mapbox GL JS 목적데이터 검색 및 처리지도 시각화 및 상호작용사용 방식HTTP 요청으로 데이터 가져오기JavaScript 라이브러리로 지도 구현 Mapbox api 예시 코드// 지오코딩 API 호출async function geocodeAddress(address) { const response = await fetch( `https://api.mapbox.com/geocoding/v5/mapbox.places/$..

새로 개편되는 프로젝트는 yarn으로 되어있어서, yarn install를 입력하니 다음과 같은 어마무시한 에러가 떴다... yarn을 지웠다가 다시 설치도 하고, cursor도 껐다켰지만, 계속 yarn이 말썽이였다.찾다보니 플젝과 컴퓨터의 node버전이 달랐다nvm을 이용하여 node버전을 맞추고 yarn install을 하니 해결완료🎶

JWT이란 JSON 형식의 데이터를 안전하게 전송하기 위한 토큰 // 로그인 시 토큰 발급 const { data } = await axios.post('api/acnt/jwt/login', rq); cookieStorage.setCookie(COOKIE_ACCESS_TOKEN, data.accessToken); cookieStorage.setCookie(COOKIE_REFRESH_TOKEN, data.refreshToken); JWT 토큰 인증방식은 비밀키로 암호화함=> 해킹에 대비해 유효기간을 둠!Access Token유효기간이 짧음주로 api 통신할 때 사용Refresh Token유효기간이 길음주로 Access Token이 만료되어 갱신될 때만 사용클라 - 서버 통신1. 로그인한 유저..

회사에서 Jenkins를 사용중이여서 찾아보게되었다...! Jenkins란 CI/CD 과정을 자동화해주는 도구(간단히 말해, 자동 배달부) 직관적인 웹 기반 사용자 인터페이스를 제공하여, 대시보드를 통해 빌드 상태와 결과를 한눈에 확인가능!초기 설정 후에는 보안 구성을 즉시 수행하는 것이 필수실제 사용 예시// 개발자가 코드를 작성하고 GitHub에 올림// Jenkins가 자동으로 코드를 가져와서:1. npm install // 필요한 패키지 설치2. npm run test // 테스트 실행3. npm run build // 빌드 실행4. scp -r build/* server:/var/www/html // 서버에 배포

모노레포는 여러 프로젝트를 하나의 저장소에서 관리하는 방식으로, 대규모 코드베이스를 효율적으로 관리할 수 있는 방법 모노레포의 특징단일 저장소 : 모든 프로젝트가 하나의 저장소에 포함되어 있어, 코드베이스의 일관성을 유지할 수 있음공유 코드 : 여러 프로젝트 간에 공통된 코드를 쉽게 공유 가능ex: 유틸리티 함수나 공통 컴포넌트를 여러 프로젝트에서 사용할 수 있음일관된 버전 관리 : 모든 프로젝트가 동일한 버전 관리 시스템을 사용하므로, 변경 사항을 추적하고 관리하기 쉬움통합 빌드 및 테스트 : 모든 프로젝트에 대해 통합된 빌드 및 테스트 프로세스를 설정할 수 있어, 전체 코드베이스의 품질을 유지할 수 있음 모노레포의 장점코드 재사용성 => 유지보수 용이일관된 개발 환경효율적인 의존성 관리협업 용이성모노..