티스토리

하루공부하루정리

검색하기

블로그 홈

하루공부하루정리

study-record99.tistory.com/m

에밀오구 님의 블로그입니다.

구독자: 12

방명록 방문하기

주요 글 목록

깃허브 프로젝트 draft 와 issue 깃허브 프로젝트에 칸반을 채우던 중 팀원분께서 issue와 draft의 차이를 물으셨고 이에 대해 정확히 설명드린것같지 않아 찾아보게 되었습니다. 원래 이렇게 배우고 익히는 것 아니겠어요? 먼저 정리하자면 일반적으로 정확히 할당받는 업무는 issue 로 만들고, 추가 예정인 업무, 하지만 배정받을지 모호한 업무는 draft 로 만들라고 하네요!Create a draft: 임시 저장용 작업 항목.Create new issue: 바로 새로운 작업을 작성하여 프로젝트와 리포지토리에 기록.Add item from repository: 기존 작업(issue 또는 PR)을 보드에 추가.Create a draft임시적으로 작성한 아이템. 완성되지 않은 상태에 두고 나중에 내용을 추가하거나 수정할 계획이 있을 .. 공감수 1 댓글수 0 2024. 12. 9.
리더의 역할 저는 미움받는 것에 무던히 못지나치는 성향이고 팀장을 맡는 것을 은근히 좋아하는 것도 아닙니다. 그래서 웬만해서는 안 맡고 싶은 마음도 있었어요. 근데 자진하는 분들도 없었고 과거 스터디장으로 뼈저리게 회고했던 경험이 떠올라, 이번에는 더 좋은 장의 소양을 기르고 싶다는 욕심에 팀장을 맡게 되었습니다. (뭐야) 결론적으로 자진해서 역을 맡았지만 성향에 안 맞는 건 어쩔 수 없어 프로젝트 진행 전까지는 긴장도 많이 하고 걱정도 많이 했습니다. 근데 최근 역할을 수행하며 과거 스터디장을 했던 저보다 많이 성장했다고 느꼈고, "처음 하는 게 제일 어렵다"는 말이 와닿는 요새라 현 과정을 적으며 스스로를 토닥이고 부족한 부분을 채우는 시간을 가지려 합니다. 이번주 프로젝트의 팀장 역할을 잘 수행하.. 공감수 2 댓글수 1 2024. 12. 5.
Today I Learned 서버 컴포넌트서버측에서 사전 렌더링을 진행할 때 딱 한 번만 실행됨 클라이언트 컴포넌트사전 렌더링 진행할 때 한번, 하이드레이션 진행할때 한번 총 2번 실행 서버 컴포넌트에는 브라우저에서 실행될 코드가 포함되면 안된다. 클리이언트 컴포넌트는 클라이언트에서만 실행되지 않는다. 클라이언트 컴포넌트에서 서버 컴포넌트를 import 할 수 없다. - > 만약 클라이언트 컴포넌트에서 서버 컴포넌트를 Import 할경우 자동으로 서버 컴포넌트를 클라이언트 컴포넌트로 변경함 /그래서 반드시 클라이언트 컴포너트의 자식 컴포넌트로 서버 컴포넌트가 존재해야한다면 서버컴포넌트를 children 컴포넌트를 받아서 삽입하면 서버컴포넌트를 클라이언트 컴포넌트로 변경되지 않고 삽입가능하다. 서버 컴포넌트에서 클라이언트 컴포.. 공감수 1 댓글수 1 2024. 11. 28.
Today I Learned [유데미x스나이퍼팩토리] 프론트엔드 프로젝트 캠프 1. [Next.js] middleware.ts미들웨어는 요청과 응답 사이에 위치해 실행되는 코드입니다. Next.js 파일 최상단에 middleware.ts 이름으로 파일을 만들면 알아서 동작됩니다.req.nextUrl.startsWith("/path") : 경로로 시작하는 모든 요청을 검사 NextRequest와 NextResponse는 표준 웹 API의 request와 response를 확장한 것 3. [ Next.js 14]개발모드(npm run dev)에서는 getStaticProps가 해당 함수의 개념과는 달리 페이지 재접속시 해당 요청마다 호출합니다. 왜냐하면 개발모드에서는 개발자가 코드를 수정했을 때 수정결과가 바로 반영하도록 설계되어 있기 때문입니다. 따라서 getStaticPr.. 공감수 1 댓글수 0 2024. 11. 27.
공부가 하기 싫어? 네! 혹시 이글을 보고 계신 여러분도 저처럼 "공부하기 싫지만 꾸준히 해야해,," 와같이 하기 싫은 일을 꾸준히 하고 싶으신가요? "1분 계획"이라고 거부조차 할 수 없는 아주 사소한 목표를 정해서 해보래요. 이런 행위의 목적은 일단 처음 특정한 행동을 꾸준히 반복하는 데 큰 의미가 있다고 합니다. 반복이 익숙해지면 그게 습관이 되는 거라 좋은 습관을 만들려면 아주 작은 일을 일단 실천해보라는 거죠. - 1분 계획세우고 바로 실천하기- 좋아하는 일과 묶기( 개발공부와 내가 좋아하는 주짓수를 묶는다면, 주짓수 기술 공유 웹사이트를 만들어야 할까요?)(독서할 때만 좋아하는 커피마시기 등 )- 환경 세팅하기 글쓰는 습관과 블로그 운영은 꾸준히 하고 싶으니 이런 글이라도 올리렵니다 흥흥 출처https:/.. 공감수 1 댓글수 1 2024. 11. 26.
11.25.2024(월) SSG Today I Learned SSG SSR CSR 방식의 차이를 살펴봤습니다. Next.js 14를 보면서 이해가 안갔던 부분이 있는데요. 처음 접속이후 다른 페이지 요청시 csr 방식으로 렌더링한다. 브라우저가 js 를 실행해서 컴포넌트를 교체후 화면을 보는 방식. 근데 또 getServerSideProps 를 사용하면 페이지 요청마다 api 요청을 새롭게 보낸다. 재요청시 csr로 클라이언트가 js 렌더링을 하는데 getServersideProps 을 사용할때는 서버도 일하는거 아닌가? csr은 서버가 일하지 않는거라고 생각했었거든요. api 요청은 서버가 하고 하지만 렌더링의 주체는 클라이언트니 서로 일하는것과 개념이 다르니 부딪치지 않는 시스템 인건가, 해당 과정들이 같이 일어났을 때(Next.js에서 초기접속이후 재.. 공감수 0 댓글수 0 2024. 11. 25.
11.24.2024(일) Today I Learned 영어 공식 문서를 꼼꼼하게 읽는 연습을 했습니다. 1. [ jotai ] 공식 문서 살펴보기 1-1. 파생원자 공식문서를 읽으며 새롭게 알게 된 점은 파생원자(Derived atoms) 라는 개념입니다. 자신의값을 반환하기 위해 다른 원자로부터 읽어 올 수 있다는 데요. 예를 들어 전체 뉴스 목록이라는 상태를 관리해야 하고, 사용자가 보고 있는 뉴스 인덱스에 대한 뉴스 상태를 저장해야할 때 유용해보입니다. const progressAtom = atom((get) => { const anime = get(animeAtom) return anime.filter((item) => item.watched).length / anime.length})import { atom, useAtom } from '.. 공감수 0 댓글수 0 2024. 11. 24.
11.23.2024(토) Today I Learned div { white-space: nowrap;// 콘텐츠 영역에 텍스트가 넘치려고 하면 넘치는 부분은 안보이고 뒤에 ... 이 붙는다 overflow: hidden; text-overflow: ellipsis;} 지식을 우겨 넣는 게 아니라, 배웠다면 이런 상황에서는 어떻게 적용될까? 스스로 계속 질문을 던지며 지식을 완전히 습득하는 연습을 했습니다. -2. next.js 사전 렌더링 3가지1. 서버사이드 렌더링 ssr : 가장 기본적인 사전 렌더링 방식이자 요청이 들어올 때 마다 사전 렌더링을 진행함 2. 정적 사이트 생성 ssg : 빌드 타임에 미리 페이지를 사전 렌더링 해둠 3. 증분 정적 재생성 isr -1. [ css ] white-space : pre-line줄바꿈만 그대로.. 공감수 0 댓글수 0 2024. 11. 23.
11.21.2024(목) Today I Learned Event.preventDefault() 기능을 자세히 알아보는 시간을 가졌습니다. 그리고 Next.js page router 관련해 정리하는 시간을 가졌습니다. -4. [ Next.js ] Link 태그와 a 태그 a 태그는 클라이언트 사이드 방식이 아닌 일반적으로 서버에 새로운 페이지를 매번 요청하는 방식으로 느립니다. 따라서 Link 컴포넌트를 사용하는 게 좋습니다. 또 Link 태그로 일어난 페이지 이동은 pre-fetching 이 일어나지만 router.push 와 같은 *프로그래매틱한 페이지 이동시 pre-fetching 이 일어나지 않는 점이 있습니다. 그러나 만약 프로그래매틱한 페이지 이동도한 Pre-fetching 이 일어나길 원한다면 하단 코드처럼 작성하면 됩니다. 반대로 Li.. 공감수 1 댓글수 2 2024. 11. 22.
11.20.2024(수) 제가 뭘 또 삽질했냐면요. Today I Learned 유데미x스나이퍼팩토리 프론트엔드 프로젝트 캠프 오늘은 저번시간에 북마크 기능이랑 페이지네이션 적용하지 못해서 이를 적용하고 오류를 분석하는 시간을 가졌습니다. 또 supabase 를 Next.js 에 적용하며 오랜만에 억까를 당해 기력이 쇠했던 날이기도 하네요. 하하 그래도 시간이 지나 경험이 쌓이면 과거의 억까들이 신의 장난이 아니라 지식부족이였다는 걸 깨닫겠지만요. 당 떨어지는 하루였습니다 ;ㅅ; -2. [ supabase ] supabase에 Next.js 개같이 털리기 superbase 적용하는 시간이 너무 고생스러워서 꼭 정리해야 겠다 싶었어요.회원가입하고 새 프로젝트를 만들기를 눌러 프로젝트 이름, 비밀번호, 지역을 넣어서 프로젝트를 만듭니다. 여기서 프로젝트와 연결하는 과정이 개인적으로 어려웠는데요. 왼쪽 home 버튼누.. 공감수 6 댓글수 5 2024. 11. 21.
11.16.2024(토) 제가 뭘 또 찾아봤냐면요. Today I Learned 1. [ tailwind.css ] ring, border, outline, 그리고 width 관계 ring이라는 못 봤던 테일윈드 문법을 봐서 외곽선 관련 테일윈드 문법들을 찾고 개념들을 정리했습니다. ring은 테일윈드가 box-shadow문법을 이것저것 속성값을 넣어서 외곽선 스타일을 구현한 거라네요. css 문법에는 ring이라는 속성이 따로 없습니다. 찾다 보니 오버플로우 사이트에 이와 관련된 질문(outline과 ring의 차이가 뭔가요)의 답변 중 흥미로운 부분이 있었습니다. "과거에 box-shadow으로 외곽선을 만드는 것을 선호했다. 그 이유는 outline(윤곽선)은 요소의 테두리 외부에 있는 선이고 공간을 차지하지 않고 테두리 반경을 따르지 않기 때문이다. 하지만 지금은 .. 공감수 0 댓글수 0 2024. 11. 17.
11.15.2024(금) TIL 1. 새롭게 배운 점은? (Learned)영어 공식 문서를 읽는 연습을 하고 프로젝트에서 자잘하게 이해안되는 부분들을 검색해보고 고민하는 시간을 가졌습니다. 새롭게 안 내용 -3. [ css 문법 ] 가상클래스 :focus :focus-visible :focus-within 의 미세한 차이 이 셋의 차이를 알려면 사용자가 특정 요소를 포커스할때 여러 디바이스를 사용한다는 점을 주목해야 하는 데요. 마우스, 스크린 터치, 키보드 tab 등의 방법으로 특정 요소를 포커스 할 수 있다는 점입니다. 그래서 :focus-visible은 키보드를 통해 포커스했을 때, focus-within 은 하위요소에 포커스가 왔을 때 상위 요소도 스타일할 때 사용한다고 하네요 이렇게만 봐서는 이해가 안 됐는데 input.. 공감수 3 댓글수 9 2024. 11. 16.
11.14.2024(목) TIL 1. 새롭게 배운 점은? (Learned)"프론트엔드는 클린 코드보다 중요한 게 정확한 기능구현과 정확한 퍼블리싱" 라는 강사님 말씀이 인상깊었습니다. 그래서 오늘은 보다 정확한 퍼블리싱을 구현하도록 고민하고 시멘틱 태그를 다시 한 번 고민을 하는 시간을 가졌어요. 더 나아가서는 테일윈드 css 와 grid로 코드짜는 것에 익숙해지는 시간을 가졌습니다. 아래 내용은 새롭게 안 내용과 고민입니다.분석과 고민1. search-bar.tsx 파일 분석1-1. 조건부 렌더를 쉽게 작성하려고 만든 cn 유틸 함수 search-bar는 내부적으로 cn함수를 사용하는 데 살펴보니 utils 폴더 내부에 있는 사용자 정의함수이고 이는 조건부 렌더를 쉽게 작성하기 위해 만든 함수라고 합니다. //utils>inde.. 공감수 5 댓글수 5 2024. 11. 14.
11.11.2024(월) TIL 유데미x스나이퍼팩토리 프론트엔드 프로젝트 캠프 1. 이번주 수업에서 좋았던 점은? (Liked)첫 수업, 첫 과제가 자신이 최종적으로 어떤 모습이길 희망하는지, 어떤 개발자가 되고 싶은지, 꼭 개발자가 아니더라도 해당 캠프를 통해 혹은 미래에 어떤 모습이길 희망하는지 적어보라는 것이었습니다. 이직 준비에 한창 열이 올라 포토폴리오 수정과 공부에만 집중하고 있었는 데 첫 과제를 받고 황당하더라고요. '그런 이상은 현재 등 따시고 배불러야 할 수 있는 생각이야.'라고, '한 공고에 300명이 몰리고 포트폴리오들도 전부 완벽에 가까운 포폴들이여서 현재 프론트엔드 신입 취업경쟁이 치열하다.'라고 선생님 방금 전까지 말씀하셨잖아요. 그냥 잘 먹고 잘살고 싶으니까! 공부하는 거죠. 솔직히 딱 든 생각들은 이랬어요. 근데 차근차근 과제를 수행하다보니 중요한.. 공감수 4 댓글수 4 2024. 11. 13.
7.18.2024(목) TIL 🏃🏻‍♀️배운 것 트리 탐색 프로퍼티 해당 노드 탐색 프로퍼티는 모두 읽기 전용 접근자 프로퍼티이며, 프로퍼티에 값을 할당하면 아무런 에러 없이 무시된다. 공백 텍스트 노드 HTML 요소 사이의 스페이스, 탭, 줄바꿈, (개행) 등의 공백 문자는 텍스트 노드를 생성한다. 자식 노드 탐색프로퍼티제공설명.childNodesNode.prototype자식 노드를 모두 반환해 nodeList 에 담아 반환 요소노드 + 텍스트 노드 .childrenElement.prototype요소 노드를 모두 반환해 HTMLCollection 에 담아 반환 only 요소노드 .firstChildNode.prototype첫번째 자식 노드 반환 요소노드 or 텍스트 노드 .lastChildNode.prototype마지막 자식.. 공감수 0 댓글수 0 2024. 7. 18.
7.16.2024(화) TIL 🏃🏻‍♀️배운 것 템플릿 리터럴로 함수 호출 function html(text, ...val) { // x text = bye // 0 text =['hibye',raw:['hibye']] // val = [] console.log(text); return tpl(frag(String.raw({ raw: text }, ...val))).cloneNode(true); // HTML 템플릿을 생성하고 클론을 반환 }, const z = html`bye`;템플릿 리터럴로 함수를 호출하면 text 가 아닌 배열형태로 매개변수에 변환되어 들어온다. HTMLCollection NodeListHTMLCollection과 NodeList는 DOM API 가 여러 개.. 공감수 0 댓글수 0 2024. 7. 16.
7.9.2024(화) TIL 🏃🏻‍♀️배운 것 id를 이용한 요소 노드 취득 HTML 요소에 id 어트리뷰트를 부여하면 Id 값과 동일한 이름의 전역 변수가 암묵적으로 선언되고 해당 노드 객체가 할당되는 부수효과가 있다. 단, id 값과 동일한 전역 변수가 이미 선언되어 있으면 이 전역 변수에 노드 객체가 재할당되지 않는다. 개발 용어 - Collection : '프로그래밍 언어가 제공하는 값을 담을 수 있는 컨테이너' css 선택자// 인접 형제 선택자 // p 요소 의 형제 요소 중에 p 요소 바로 뒤에 위치하는 ul 요소를 선택 p + ul {}//일반 형제 선택자 // p 요소의 형제 요소 중에 p 요소 뒤에 위치하는 ul 요소를 모두 선택 p ~ ul {} css 선택자를 이.. 공감수 0 댓글수 0 2024. 7. 9.
7.8.2024 TIL 🏃🏻‍♀️배운 것 Async 어트리뷰트 와 defer 어트리뷰트의 차이 async 어트리뷰트는 HTML 파싱과 외부 자바스크립트 파일의 로드가 비동기적으로 동시에 진행된다. 단 자바스크립트의 파싱과 실행은 자바스크립트 파일의 로드가 완료된 직후 진행되며, 이때 HTML 파싱이 중단된다. 태그 순서와 상관없이 로드가 완료된 자바스크립트 파일부터 먼저 실행되므로 순서 보장이 필요한 Script 태그에는 async 어트리뷰트를 지정하지 않는다. defer 어트리뷰트는 HTML 파싱과 외부 자바스크립트 파일의 로드가 비동기적으로 동시에 진행된다. 이 점은 async 와 같으나 자바스크립트의 파싱과 실행은 HTML 파싱이 완료된 후 DOM 생성이 완료된 후 태그 순서대로 자바스크립트 파일이 실행된다... 공감수 1 댓글수 3 2024. 7. 8.
2024.6.20(목) TIL 🏃🏻‍♀️배운 것 link 태그의 media 속성 link태그의 media 속성은 해당 css 파일이 어떤 장치에 최적화된 파일인지 설명하는 속성이다. 예를 들어 상단 코드의 layout.css는 컴퓨터나 테블릿, 스마트폰 등의 스크린화면에 최적화된 css 파일임을 설명한다. 웹사이트 개발을 위해서만 css와 html 코드를 사용했는 데 다른 장치 개발에도 link 태그를 사용한다는 점이 흥미로웠다. 장치설명all기본값으로, 모든 미디어 타입의 장치print인쇄 미리 보기 기능 또는 페이지 출력screen컴퓨터나 테블릿, 스마트폰 등의 스크린speech페이지를 소리 내어 읽어주는 스크린 리더기(screen reader)css 파일이 어떤 장치에 최적화된 파일인지 설명하는 것외에도 반응형 웹사.. 공감수 0 댓글수 0 2024. 6. 20.
[모던 자바스크립트 Deep Dive] 15장~17장 모던 자바스크립트를 2회독하는 시점에서 인상깊은 점을 정리합니다. 15장 let, const, 키워드와 블록 레벨 스코프 기존 var 키워드가 가지는 문제점 3가지 (1. 변수 중복 선언 허용 2. 함수 레벨 스코프 3. 변수 호이스팅) 를 설명하는 부분 중 1. 변수 중복 선언 허용에서 나중에 작성한 중복 선언문의 초기화 문 포함 유무에 따라 다르게 동작한다는 부분이 인상 깊었습니다. var x = 1; var x = 100; // 초기화문 0 console.log(x); //100 var y = 1; var y; //초기화문 x console.log(y); //1 초기화문이 포함되어 있다면 var 키워드가 생략된 것처럼 재할당이 일어나며, 초기화문이 포함되어 있지 않다면 해당 문은 무시됩니다. let.. 공감수 0 댓글수 0 2024. 2. 23.
[모던 자바스크립트 Deep Dive] 11장~14장 11장 원시 값과 객체의 비교 원시 타입과 객체 타입 구분 3가지 원시 타입객체 타입 변경 불가능한 값(변수에 재할당시 교체됨) 변경 가능한 값 (확보한 메모리 공간에)실제값 저장 참조값 저장 원시 값 복사(값에 의한 전달) 참조값 복사 (참조에 의한 전달) 원시값 = 불변한 값-> 데이터 신뢰성 보장. 변수값 변경시 재할당하는 방식을 채택함으로써 값의 변경, 즉 상태 변경을 추척하기 쉽게 만든다. 반면 객체 = 변경 가능한 값 -> 데이터 신뢰성 보장 x, but 메모리 사용의 효율성과 성능 향상 해시테이블과 비슷한 구조 = 객체 -> 생성하고 관리하는 데 매우 복잡하며 비용이 많이 듦. 클래스 기반 객체 지향 프로그래밍(c++,java)과 달리 자바스크립트의 객체는 편리성을 위해 클래스 없이 객체를 .. 공감수 0 댓글수 0 2024. 2. 12.
[모던 자바스크립트 Deep Dive] 09,10장 09장 타입 변환과 단축 평가 명시적 타입 변환, 타입 캐스팅 : 개발자가 의도적으로 값의 타입을 변환하는 것 암묵적 타입 변환, 타입 강제 변환: 개발자의 의도와 상관없이 표현식이 평가되는 도중 자바스크립트 엔진에 의해 암묵적으로 타입이 자동 변환되는 것. 문자열 타입으로 변환 +연산자를 사용하고 피연산자중 하나 이상이 문자열일때 0+'' //'0' 1+ '' // '1' true+ '' //'true' 문자열 타입으로 변환 산술 연산자를 사용할때, +단항 연산자는 피연산자가 숫자 타입이 아니면 숫자 타입 의 값으로 암묵적 타입 변환을 수행 1- '1'//0 + '' //0 +'0' //0 +false //0 단축 평가 단축 평가: 표현식을 평가하는 도중 평가 결과가 확정나는 경우 나머지 평가과정은 생.. 공감수 1 댓글수 1 2024. 2. 4.
[모던 자바스크립트 Deep Dive] 07장 연산자,08장 제어문 07장 연산자 피연산자 :"값" -> 명사 연산자 : "피연산자를 연산하여 새로운 값을 만든다"-> 동사 연산자의 종류 1. 산술 연산자 : 수학적 계산을 수행해 새로운 숫자 값을 생성 - 이항 산술 연산자 : + , - 등 - 단항 산술 연산자 : ++ , -- , + ,-(양수 음수 변환) - 문자 연결 연산자 : + (피연산자중 하나 이상이 문자열인경우 문자열 연결 연산자로 동작) + 단항 연산자를 사용할 때 숫자 타입이 아닌 피연산자를 연산하면 숫자 타입으로 변환해 반환한다. var x = "1"; console.log(+x); //숫자 1 console.log(x); //"1" 부수효과없음 var y = false; console.log(+y); //숫자 0 var z = "hello"; con.. 공감수 0 댓글수 0 2024. 2. 2.
[모던 자바스크립트 Deep Dive] 05장 표현식과 문, 06장 데이터 타입 05장 표현식과 문 값 : 식(표현식)이 평가되어 생성된 결과 리터럴 : 사람이 이해할 수 있는 문자 또는 약속된 기호를 사용해 값을 생성하는 표기법 표현식: 값으로 평가될 수 있는 문. 표현식이 평가되면 새로운 값을 생성하거나 기존 값을 참조함. const score= 10+10; score; // 2지누,8진수 등의 데이터 타입을 제공하지 않기 때문에 이들을 참조하면 모두 10진수로 해석됨. - 숫자 타입은 모두 실수 처리됨. - Infinity, -Infinity, NaN 등의 특별한 값도 표현 가능 var binary = 0b01000001; //2진수 var hex = 0x41; // 16진수 console.log(binary); //65 console.log(hex); // 65 console.. 공감수 0 댓글수 2 2024. 2. 1.
TIL 2023.01.17 BEM(Block Element Modifier) HTML 클래스 속성의 작명법 요소__일부분 Undersore(Lodash) 기호로 요소의 일부분을 표시 요소--상태 Hyphen(Dash) 기호로 요소의 상태를 표시 position: fixed , absolute 적용시 1. width: auto 로 변환됨. -> width: 100% 명시 혹은 너비 명시 2. positon:fixed,absolute top: 0 bottom 0 margin: 0 auto 와 같이 세로중앙정렬을 postion으로 할때 height 명시해야함 . 3. inline 태그내 적용시 자동으로 display :block 화 둥근 모서리 사각형 내부 자식 img 태그로 이미지를 채워 넣을 때: 부모요소에 overflow: hid.. 공감수 0 댓글수 0 2024. 1. 17.
[프로그래머스]기능개발-스택/큐 https://school.programmers.co.kr/learn/courses/30/lessons/42586 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 고민한 부분 이 문제에서 까다롭다 생각한 부분은 각 기능별 배포가능한 날짜가 들어있는 배열을 각 배포일마다 몇개의 기능이 배포되는지 배열형태로 바꾸는 부분이였습니다. 이를 해결하기 위해 정답 배열 answer 를 생성하고 배포일마다 몇개의 기능이 배포되는지 카운트하는 features 변수와 정식배포날짜 releaseDate 변수를 준비했습니다. 기능별 배포가능날짜가 들어있는 배열 dueDate을.. 공감수 0 댓글수 1 2023. 12. 18.
테스트 오류와 해결 테스트 에러 해당 테스트 코드를 통과되지 않은 모습입니다. 테스트 코드에 익숙치 않아 주어진 ApplicationTest.js를 토대로 공부했습니다. 해당 테스트는 전진-정지에 관한 테스트 코드인데 MissionUtils.Console.print 사용될때를 추적하여 해당 메서드가 출력될 때 포함 되는 문자열 'pobi : -' 이 포함되었다면 통과하게 되는 코드라고 파악했습니다. 하지만 작성한 코드는 실제 실행시MissionUtils.Console .print 를 잘 사용하며 'pobi : -' 또한 잘 출력되는 모습이라 의아했습니다. 테스트 코드를 잘 파악했는지도 확신이 들지 않고(레거시한 한글블로그와 버전업으로 지식의 오류가능성이 있기 때문에) 몇 번이고 코드를 재차 확인하고 분석해도 답이 안나와 고.. 공감수 0 댓글수 1 2023. 11. 1.
너 git 제대로 쓰고 있니? 네니오? ;ㅅ; 우아한 프리코스 1주차 공통피드백을 받고 적잖히 당황했습니다. 1주차 미션의 목표 중 하나가 git에 익숙해지기 였는 데 "나는 과연 익숙한가?"를 생각해보면 익숙하기 하기야 하지만 쓰는 명령어가 지극히 제한돼 있다 느꼈고, git 컨벤션을 제대로 익히고 쓰고 있는 지 확신이 들지 않았습니다.( 그러고 보면 미션 초반 포비가 1주차 미션의 목표는 환경설정에 익숙해지는 것이다라고 말씀하셨던게 이제야 기억이 나네요..) 코드를 잘 작성하고 싶다는 마음과 코드 리뷰중 보인 클래스 문법과 mvc 패턴을 익히고 싶은 욕구때문에 정작 중요한 git에 미쳐 깊게 파고들어 공부하지 못했다고 느꼈습니다. mvc 패턴보다 git을 익숙해지고 정확히 사용하는 것이 더 중요하다 판단해 해당 과정을 공부했습니다. 커밋단위를 너.. 공감수 0 댓글수 1 2023. 10. 30.
[우아한 테크 코스 : 숫자 야구 게임] 우리 꽤 잘 맞을 지도? 질문과 배운 점. 1. vscode 터미널창에 node 파일명.js 명령어를 입력해 실행하는 방법과 2. 상단 실행 버튼을 눌러 출력창에 실행하는 방법의 차이가 뭐예요? 초반 과제를 진행할 때, 프로그래밍 요구사항 중 "Console.readLineAsync"를 활용하던 중 작성법에 맞게 구현했는 데도 숫자 입력이 되지 않아 애를 먹었습니다. 알고 보니 node환경에서 파일을 실행하는 방법을 잘못된 방법으로 진행해 다음과 같은 어려움을 겪었던 걸 알게 되었습니다. 처음 사용했던 방식은 상단 실행버튼을 눌러 출력창에 실행하는 방법을 이용했는 데요. 출력창과 터미널창 디버그 콘솔창의 차이가 궁금해 공부하는 시간을 가졌습니다. - 출력 창 : 로그 혹은 에러정보를 담고 있는 창. 값 입력이 불가능하다.(그래서.. 공감수 0 댓글수 0 2023. 10. 27.
Property Attribute object property 객체의 프로퍼티는 크게 두가지로 나눌 수 있습니다. 우리가 흔히 key & value 형태의 프로퍼티들이 data propety에 해당됩니다. 새롭게 알게 된점은 접근자 프로퍼티입니다. 새로운 종류의 프로퍼티이며 본질은 함수인데, 외부 코드에서는 함수가 아닌 일반적인 프로퍼티처럼 보이는 특이한 점입니다. 접근자 프로퍼티에는 getter(조회) 와 setter(설정)로 표현됩니다. 객체 리터럴 안에서 getter는 get 으로 setter는 set으로 표현됩니다. 데이터 프로퍼티(data propety) : 키와 값으로 형성된 실질적 값을 가지고 있는 프로퍼티 접근자 프로퍼티 (accessor propety) : 다른 값을 가져오거나 설정할 때 호출되는 함수로 구성된 프로퍼티입.. 공감수 0 댓글수 0 2023. 10. 26.

문의안내

티스토리
로그인
고객센터

티스토리는 카카오에서 사랑을 담아 만듭니다.