Position 속성에 대해 명확하게 설명할정도로 정리가 되지 않아서 공부했습니다.position을 이용해 어떻게 배치할지 정하고,top, right, bottom, left를 이용해 어디에 배치할지 정할 수 있습니다.일반적인 흐름을 뜻하는 기본값입니다.top, rig
https://github.com/yjs03057/33-js-concepts자바스크립트 개발자가 알아야하는 33가지 개념 중 1번째 콜스택자바스크립트는 한번에 하나의 작업을 하는 단일 스레드 언어입니다.콜스택과 이벤트 루프라는 개념은 한번에 하나의 작업을 하는
https://github.com/yjs03057/33-js-concepts모든 자바스크립트 개발자가 알아야 하는 33가지 개념 중2\. 원시자료형3\. 값 타입과 참조 타입에 대해 공부했습니다.추가로 불변성의 정의, 장점도 같이 적겠습니다.자바스크립트에서 변
https://velog.io/@dishate/Javascript-%EC%BD%9C%EC%8A%A4%ED%83%9D%EA%B3%BC-%EC%9D%B4%EB%B2%A4%ED%8A%B8-%EB%A3%A8%ED%94%84-V8-%EC%97%94%EC%A7%84%EC
어떤 기업의 면접 후기 글을 읽다가 js관련 질문이 햇갈려서 관련 개념을 다시 익히느라 늦게 돌아왔습니다.위 문제였는데요. 정답을 모르겠어서 관련된 내용으로 제가 햇갈려 한 내용들을 다시금 정리했습니다.스코프, TDZ관련 내용으로 포스팅하고 이후에 this에 대해서 다
내가 햇갈리는 것print() 안에서 name이 가지는 값을 잘 모르겠다. 오류가 나야할것 같은데?=> 지난 호이스팅 관련 글에 정리하였습니다.this가 무엇을 의미해서 this.name이 달라지는지 모르겠다.=> 이번 포스팅에 정리합니다.this는 함수 호출에 따라
클로저를 공부하다가 이해되지 않았던 점들을 의문점들을 정리하며 글을 작성하겠습니다.의문의 순서1\. 클로저가 어떻게 외부 변수를 참조하는가?2\. 클로저를 왜 쓰는가?3\. 데이터 은닉을 왜 하는가?: 기본적인 개념은 '외부 변수를 참조하는 함수를 클로저 함수'라고 합
브라우저 동작 원리를 공부하면서 전체적인 브라우저의 과정을 함께 살펴보겠습니다.추가적으로 가상 DOM과 가상 DOM에서 불변성이 중요한 이유도 정리하겠습니다.url에 google.com을 치면 어떤 일이 발생할까요?방문했던 사이트를 기록해두면, 다시 방문할 때 전보다
브라우저를 닫았다가 켜도 전에 하던 작업을 기억하려면 어떻게 해야 할까요?클라이언트에서 데이터를 저장할 수 있는 방법에 대해 알아보겠습니다.브라우저에 저장하는 작은 문자열서버는 요청이 누가 보낸건지 알 수 없기 때문에, 쿠키를 통해 나임을 증명합니다.일반적으로 서버에서
프로그래머스 데브코스에서 노션을 클론 코딩하는 개인 프로젝트를 수행했습니다.기본 요구사항은 모두 구현했습니다만여러 기능을 추가하면서 아직 남아있는 버그도 있고, 프로젝트를 진행하면서 아쉬운 점이 많습니다.프로젝트를 돌아보며 이런 점들을 정리하고, 성장하려고 합니다.많은
프로그래머스 데브코스 강의에서 무한스크롤에 대해서 공부했습니다.이후에 따로 찾아본 내용을 합쳐서 무한 스크롤은 무엇인지, 외에 다른 방법은 없는지, 어떻게 구현하는지를 정리하겠습니다.구글에 어떤 내용을 검색했을 때페이스북에서 어떤 내용을 검색했을 때네이버에서 초콜릿을
바탕화면에서 파일을 옮길 때 드래그를 통해 옮길 수 있습니다.하지만 웹 사이트에서는 옮겨지는게 있고, 아닌게 있습니다.특히 글은 옮겨지지 않고 선택만 됩니다.웹사이트에서 드래그는 할 수 없는걸까요?오늘은 drag 관련 event에 대해 공부한 내용을 기록하겠습니다.드래
노션 클론 코딩을 진행하면서 textarea tag를 사용하지 않고contenteditable="true"가 적용된 div tag를 사용하려고 했습니다그러나 특정 상황에서 innerHTML로 text를 바꾸고,focus해서 계속 입력을 진행하려는데 뜻대로 되지 않았습니
react 강의를 듣다가 팀원들 간 useCallback에 관한 얘기가 나와서 관련 예제를 만들어 슬랙에 올렸는데, 블로그에도 올리면 좋을 것 같아서 조금 수정 후에 글을 작성합니다react 공식문서 - usecallback(https://ko.reactjs.
mui를 사용해서 데브코스 프로젝트를 진행하고 있습니다mui에서는 여러 컴포넌트의 예시를 볼 수 있는데Box 컴포넌트가 div 태그와 다른점은 무엇인지,sx로 css를 적용하는 것과 style로 css를 적용하는 것이 무엇이 다른지 찾아보게 되었습니다react에서 cs
6월 7일 화요일 ~ 6월 22일 수요일까지 약 2주간 데브코스 중간 팀 프로젝트를 진행했습니다간략한 프로젝트 소개와 담당 개발 파트를 언급하고, 다음엔 이렇게 해야겠다 싶은 부분들을 정리하겠습니다GAMEBU는 게임을 같이할 파티를 구하는 종합 SNS 사이트입니다위 링
맥북을 구입하고 5일째 되는 오늘평소처럼 데브코스 강의를 듣고 개인 리포에 정리하던 중 package.json이 git에 올라가지 않았습니다내용을 바꿔봐도 git이 내용이 바뀜을 감지하지 못했습니다한 2시간 삽질하고 알아내긴 했습니다git이 package.json을 감
이 파트의 예시 코드는 Youtube - Web Dev Simplified - Every Beginner React Developer Makes This Mistake With State 동영상을 번역했음을 알립니다.user라는 상태 데이터가 있습니다select 버튼을
eslint를 보통 검색해서 다른분들이 사용하는걸 그대로 사용했습니다 하지만 데브코스에서 프로젝트나 과제를 진행하고, 채용 과제에서도 eslint를 계속 사용하다 보니 관련 셋팅에 대해서 공부하고 기록하게 되었습니다 react 프로젝트를 생성 eslint 추가, .v
모 기업의 채용 과제에 사용했던 화면에 들어왔을 때 애니메이션 동작을 실행하도록 하는 기능을 포스팅하겠습니다기본적인 애니메이션 코드입니다새로고침하면 나타난것처럼 동작합니다여러 사이트에서 스크롤을 내려서 화면에 잡혔을 때 슝~ 하고 움직이는 애니메이션을 본적이 있으신가요
220523 TIL주말에는 vue 과제를 진행했습니다react 강의를 미리 예습하면서 강의가 밀리지 않도록 할 계획입니다Vue + 영화 검색 API + Design 프레임워크를 사용해 영화 검색 사이트를 만들고 배포하는게 8주차 과제였습니다ant-design-vue를
예전에 노션 클론 코딩을 하고 회고 글을 작성했었습니다미뤄놨던 배포와 버그 수정, 리팩토링을 진행할 예정입니다그 중 배포할 때 api 요청 url과 관련 api key에 대해서 숨겨야 하는 사항이 있어서 vercel의 serverless function을 먼저 도입하게
Vercel Serverless 예제 이후 바로 프로젝트에 vercel serverless 함수를 적용하려 했으나post, put method와 body 조작이 필요해서 관련 내용을 git, vercel 배포링크에 추가했습니다그 내용을 블로그에도 작성하겠습니다npm i
데브코스에서 진행한 개인 프로젝트 - 노션 클론을 리팩토링하면서 생성자 함수로 작성된 컴포넌트를 클래스 문법으로 변경했습니다리팩토링하면서 클래스는 어떤 특징들이 있는지 공부한 내용을 공유합니다new 키워드와 함께 사용해서 객체를 생성하는 함수를 생성자 함수라고 합니다생
데브코스에서 최종 프로젝트로 진행한 책 스터디 지원 서비스 책모이 프로젝트를 완료하고 배포했었습니다분명 잘 돌아가고 있었는데 갑자기 팀원분의 제보로 에러를 알게 되었습니다SSR을 사용하는 스터디 상세 페이지로 이동할 때 굉장히 오랜 시간이 걸리고이후 Vercel 504
최근에 Expo를 통해 웹과 모바일 앱을 동시 지원하는 프로젝트를 개발하고 있습니다React-Native Mui를 사용하고 있는데 style을 수정한 방법을 공유하고자 글을 작성합니다Modal을 통해 사용자에게 정보를 보여주고 확인을 받고자 했습니다React-Nativ
최근 면접 본 회사에서 나온 질문이 있었습니다위 코드의 결과가 무엇인가?를 묻는 질문이었는데해당 질문을 통해서 typeof를 제대로 이해하지 못하고 있다는 생각이 들어 공부했고, 함께 언급되는 instanceof와 비교해서 글을 작성합니다typeof는 변수나 값의 자료
react-native에서 표로 데이터를 보여줄 일이 생겨서 table component를 찾고 있었습니다react-native-table-component 라이브러리를 찾아서 사용했었으나, 큰 카테고리 데이터 안에서 세부 내용을 보여줘야 했습니다위 링크의 Exampl
현재 회사에서 vue.js를 사용하고 있습니다그러나 아직도 vue를 미숙하게 다뤄서 생기는 문제들이 있어서 개념을 다시 공부하고 있습니다이 글은 vue.js의 data 중 제가 미숙하게 이해한 부분을 정리합니다vue를 공부하려고 왔다면 공식문서를 추천드립니다어떤 데이터
uuid란 무엇이고, 언제 사용하는지그리고 그걸 대체할 수 있는 crypto 객체의 crypto.randomUUID() 메소드에 대해서 정리합니다uuid는 범용적인 고유 식별에 사용될 id를 뜻합니다주로 사용할 때는 다른 값과 중복되지 않은 고유 값을 생성해야 할 때
프로그래머스 데브코스를 수강하고 2022년 9월 ~ 10월에 많은 회사에 지원하고 면접을 봤을 때, 2곳에서 api 요청 외에 promise를 사용하는 코드를 물어봤습니다공통적으로 sleep을 만드는 코드였는데 2곳 모두 대답하지 못했었고, 이후에 찾아보지도 않았던 내
유튜브 알고리즘에 console.log만 쓰냐는 변수에 원하는 값이 있는지 확인할 때 console.log() 출력으로 확인할 수 있습니다하지만 확인해야할 사항이 많다거나, 정확히 어느 부분인지 몰라서 여러곳에 console.log()를 사용한다면 개발자조차 햇갈릴 수
모두의 연구소 데브콘: 7월엔 강남을 다녀왔습니다