2023년부터 로그 기록 2023년부터 로그 기록

친구들과 함께 모의면접 스터디 과제를 수행한다.이번주 진행하는 기술 면접 주제는 아래와 같다.1. 기술 면접을 위해 다음 키워드 공부해오기- 브라우저 렌더링 과정 (CRP)- URL 구조- 주소창에 URL 입력 시 동작 과정- http와 https- 브라우저 저장소 (Local Storage, Session Storage, Cookie)- CORS, SOP- REST API- SSR, CSR, SSG, ISR2. (내가 뽑은) 인적성 면접 질문 2개 정리- 공백기가 존재하는데 왜 발생했고, 공백기 동안 무엇을 했나요?- 앞으로 성장해 나가며 3년 뒤, 본인만의 비전이나 성장 방향에 대해 말해주세요.  1. 기술 면접 키워드 공부답변은 20초 답변을 기준으로 작성한다. 1-1. 브라우저 렌더링 과정 (CR..

이러다간 안되겠다! 😱 싶어서 위기감을 가지고 쓰는 2024년 상반기 회고.벌써 2024년 상반기가 지나가고 있다. (오늘은 2024.05.28)6개월이 지났지만, 정기적으로 회고를 안해서 내가 잘 성장하고 있는지 점검을 못했다.6개월을 돌아보며 잘한 점은 칭찬하고, 부족한 부분은 하반기에 보완하도록 하자. 오늘 회고해볼 세부 내용은,   1) 목표 달성률 확인하기   2) Localhost에서 벗어날 용기   3) 코딩 테스트 부담감 내려놓기   4) 액션 아이템 오늘 문득 슬퍼서 왜 그럴까 생각을 해봤는데,최근 나에게 평가 받고,지인 들에게 평가 받고,인사 담당자들에게 평가 받았다. 그런데 사람들과 대화하면서 내가 바랬던 건,있는 그대로 '잘하고 있다'라는 인정과 칭찬이 아니었나 싶다.아프지만 나를..

패스트캠퍼스에서 타입스크립트 강의를 듣고 있는데 Error가 발생했다. 처음 parcel 이란 번들러를 사용하는데, 에러가 발생하니 난감했다. 경로에 한글이 있어서 Error가 발생했나 싶어서 경로에 한글을 없애보고, VSCode를 재실행해도 의미없었다. Error 문구는 No such file or directory 라는데 전부다 존재한다. 정말 '뭐지?' 싶었다. Problem parcel 번들러는 package.json 내에서 scripts에서 아래와 같이 정의해서 사용하고 있다. "scripts": { "dev": "parcel ./index.html", "build": "parcel build ./index.html" }, 그리고 Error 내용은 아래와 같다. > ts-test@1.0.0 de..

비지니스 로직을 제압하는 개발자가 퇴근을 한다 프론트에서 해드릴게요! - 의도 자체는 좋았으나 안좋은 결과로 귀결되는 마는 상황 - 지옥으로 가는 길은 선의로 포장되어 있다. (서양 속담) - 잠깐 멈춰서서 구조적인 원인은 없는지 생각해볼 필요가 있다. - 동료를 돕기 위해 가져온 백엔드 추천, 페이지네이션, 검색 로직을 프론트엔드에서 구현하는게 뭐가 문제인가? - 협업에 강한 개발자 아닌가? - 문제 1. 이름에 맞는 단순한 역할의 컴포넌트가 아닌 본질에서 벗어난 컴포넌트가 되어간다. - 문제 2. 웹 애플리케이션 뿐 아니라 앱에서도 동일한 로직을 구현한다면 다른 언어로 같은 로직을 다시 구현해야 함 - 문제 3. 핵심 비즈니스 로직이 외부에 노출된다. (ex. 부당하게 할인을 챙겨갈 수 있음) - 정..

비즈니스 로직 완전 정복 with React - 강의 : 리맴버 오종택 강사님 - 역량 향상 세션 : 2주 커리큘럼 - 1차 : 12.5(화) 20시, 우리의 컴포넌트가 복잡해지는 원인 - 2차 : 12.9(토) 10시, 비즈니스 로직을 제압하는 개발자가 퇴근을 한다 - 3차 : 12.12(화) 20시, SOLID한 컴포넌트 만들기 - 4차: 12.16(토) 10시, Logic First, React Later 코스 시작 전 당부의 말씀 - 2주 동안 커리큘럼에 제시된 모든 것들을 '마스터' 한다고 생각하지 말자 - 키워드와 힌트를 얻어 간다. - 책이나 강의 보다 내가 쓴 것만 기억난다. (계속 부딪치고 노력하자) - 수업에서 들은 개념들을 면접에서 적용하기 힘들 수 있다. - 강의 듣기가 아니라 직접..

오늘의 기술면접 주제는 REST API 에 대해서 다룬다. 1. REST API 1-1. 30초 답변 REST API는 클라이언트와 서버 간의 통신 방식을 정의한 REST(REpresentational State Transfer)라는 아키텍처 스타일을 따르는 웹 API입니다. 이 중에 REST 아키텍처 스타일을 완벽하게 준수하는 API의 경우 RESTful API라고 부릅니다. REST API는 HTTP 요청을 통해 클라이언트와 서버 간에 리소스를 주고받을 수 있습니다. 리소스는 JSON, XML, HTML 등의 다양한 형식으로 표현될 수 있으며, URI(Uniform Resource Identifier)로 식별됩니다. REST API는 상태가 없으므로 각 요청이 독립적이고 자기 서술적인 특징을 가집니다..

같이 멋쟁이사자처럼 프론트엔드 스쿨 7기 동기들과 함께 책 집필을 진행한다. 책 집필 회의는 매주 2회, FE파트와 팀 전체 회의가 진행된다. 우리 책집필 주제는 프론트엔드와 백앤드 개발자의 기술 면접 질문을 다룬다. 채용 공고 사이트 및 블로그에서 단골 질문에 대한 답변을 1분 이내의 답변으로 구성한다. 나는 우선, 시간이 안걸리는 주제 2개를 선정해서 필수 항목을 채우고, 시간 많이 걸리는 주제 1개를 공유하고자 한다. 기존 생활에 책집필 일정이 들어와 시간을 효율적으로 잘 사용해야 한다. 1. 객체 지향 프로그래밍이란? 1-1. 질문의도 자신의 주 프로그래밍 언어의 특징을 알고 쓰지는 알아보는 단골 면접 질문이다. 또는 면접 준비를 했는지 태도를 평가하는 기초 질문으로 쓰일 수 있다. 1-2. 모범..

목차 1. 이전 회고 내용 2. Keep 3. Problem 4. Try 5. 결론 멋쟁이사자처럼 프론트엔드 스쿨, 부트캠프 생활을 거의 2 달째 보내고 있다. 저번주에는 HTML/CSS 가 끝났고, 이제 다음주 수요일이면 JavaScript 강의도 끝난다. 목요일부터 React 를 시작하기 전에 8월 회고를 앞당겨 진행해 본다. 1. 이전 회고 내용 1-1. Problem에 대한 해결책 (1) 목표의 재설정 > 현재 상황에 맞는 적절한 목표로 재설정 > 이전 목표: 매일 꾸준한 백지코딩 복습과 작성 1시간 이내로 요약해서 쓰는 TIL 블로그 기록 > 현재 목표: 매일매일 오늘 배운 개념을 나만의 코드로 정리해서 GitHub push 하기 (시간되면 블로그 기록) (2) 알고 있던 내용라도 코드로 개념 ..

목차 1. JS DOM 2. 잡담 1. JS DOM (Document Object Model) 1-1. DOM 노드 요소 제어 - DOM API를 이용하면 요소를 새롭게 생성하고, 위치하고, 제거할 수 있다. (1) document.createElement(target) : target 요소를 생성한다. (2) document.createTextNode(target) : target 텍스트를 생성한다. (3) document.appendChild(target) : target 요소를 element의 자식으로 위치한다. (4) document.removeChild(target) : element 의 target 자식 요소를 제거 - 1~4 이후에 만들어진 새로운 메서드 (훨씬 편리하다) (5) docume..

의도대로 결과가 나오지 않는 JavaScript (JS) 메서드를 어떻게 사용하면 좋을까?그때그때 퍼포먼스를 발휘해 예외 케이스를 찾고 해치우면서 코드를 하는게 맞는 걸까?나는 훌륭한 코드를 자신의 코드로 학습하고 DB화 하거나 GitHub Repository 에 정리하여 효율적으로 일하는게 맞다고 생각한다. 그래서 이 글은 내가 JS를 기초부터 다시 공부하면서 유용한 실무자 노하우 코드만을 따로 뽑아 정리한 일종의 DB 이다.실무자 노하우 코드는 VSCode 의 경우 스니펫(snippet)으로 등록해서 쓰면 훨씬 편할 것이다.실무를 하면서 오류를 최대한 출력하지 않으면서, 작동을 멈추지 않는 JS 의 메소드로부터 우리 모두 자유로워지는데 도움이 되길 바란다. 1. type 체크 : typ..

목차 1. JD 분석 2. 네이버 Front-end : Naver Glace CIC 이력서 작성을 위해 국내 기업 총 3곳의 프론트엔드 직무(JD, Job Description)분석 수행한다. 이번 글에서는 네이버 플레이스 서비스를 제공하는 NAVER Glace CIC 에 대한 직무 분석을 다룬다. 이번 글에서는 JD(Job Description) 분석이 무엇인지 살펴보고, 지도에서 장소를 검색하고 예약, 리뷰 작성 및 탐색 서비스를 제공하는 대표적인 기업 Naver의 JD 분석을 수행한다. 평소 구글지도와 네이버 지도에 맛집을 등록하고 리뷰를 남기는 걸 좋아해서 흥미가 절로 생긴다. 1. JD 분석 직무 안내(JD, Job Description)는 목표로 하는 기업에서 어떤 역량을 요구하는지 알 수 있..

목차 1. 결론 2. 장점 알려드림 3. 단점 알려드림 4. 차이점 알려드림 5. KPT 회고 개발자 한번 해볼까? 실력이 부족한데 부트캠프를 한번 들어가볼까? (광고 아님!) 부트캠프를 고민하는 당신에게 멋쟁이사자처럼 부트캠프 Front-End School (이하 멋사 FES) 7기에서 한 달 보내보고 후기 알려줌 멋사 Front-end School 7기(FES7)에 합격하여 수업을 들은지 1개월이 지났다. 오늘은 내가 궁금했었고, 멋사 부트캠프를 고민하는 (예비) 개발자들에게 도움이 될 만한 경험담을 작성해 본다. (보통 후기 또는 회고라고 있어 보이게 이야기 하더라) 일단 FES7 장단점 부터 시작해서 본인에게 이 교육이 맞는 것인지 확인해보면 좋을 것 같다. 그리고 나서 고민하고 있는 다른 선택지..

목차 1. JavaScript 개요 2. JavaScript 견고한 기본기 자바스트크립트를 처음 시작하는 사람들에게 해주신 호준강사님께서 말씀하셨던 말이 기억에 남아서 기록한다. '꺾이지 않는 마음'은 없습니다, 회사가면 다 꺾입니다. 중요한것은 '꺾여도 계속 가는 마음' 입니다. 1. JavaScipt 개요 1-1. CSS 라이브러리 정리 - Tailwindm Bootstrap, Sass, Pure css 어디서 써야하는지 - 자동화 순 Tailwindm > Bootstrap > Sass > Pure css - 디자인이 나온 상태에서 Project : Tailwind > Sass > Pure css - 시간이 매우 촉박하고 ROI(input 대비 output) 가 제대로 나오는 프로젝트 : Bootst..

목차 1. 기념일 계산기 2. GitHub 올리기 3. Netlify 소스 코드 배포하기 오늘 휴강이다. 멋쟁이사자처럼 프론트엔드 스쿨에서 제공해준 LMS (학습관리시스템) 강의를 자습한 내용을 기록한다. 비디팅 코딩(Video + Editing = Viditing Coding) 을 통해서 수업하는 신기한 방식으로 수업을 하는데, 약간의 오류들이 보이지만 생각보다 새로운 언어를 익히는데 정말 도움이 되는 것 같다. 마치 개인 과외를 받는 느낌이다. 1. 기념일 계산기 1-1. 객체(Object) - 배열처럼 여러개의 자료형을 담는 자료형 - 키(key) or 속성명 - 값(value) or 속성값 : 배열, 객체, 함수(메서드(method))가 들어갈 수 있음. - 객체.키; - 객체.키(); 값이 메서..

목차 1. 수업 외 특별 활동 2. Tailwind 개요 3. Tailwind 로 이력서 만들기 1. 수업 외 특별 활동 - 책 집필 (8월 중순, 팀구성 자유, 주제 구상해오기) - 오픈소스 프로젝트 - 신입 개발자 자기소개 작성 문의 (희망 연봉 명시된 이력서를 보낼 것) - Sass TailwindCSS Bootstrap (Bootstrap 이 가장 빠름, 돈으로 해결함) 2. Tailwind 개요 - Tailwind : 만족도가 높고 꼭 배워야 한다고 생각함 - 부트스트랩 : 찍어내야하고 빨리 만들어 낸다면 사용 - 프론트엔드 스쿨에서 유료강의도 제공해줄 것이지만 지원회사에서 Tailwind 를 사용할 때 시간내서 더 볼 것 2-1. Tailwind CSS HTML 을 벗어나지 않고 모던 웹사이트..