EtoC

첫 면접을 봤는데 2차부터 4차 면접까지 꾸준하게 받은 질문이 eventloop와 garbage collection이였다. 책에서 스윽 보고지나가면서 대충 이런거구나하고 넘겼는데 계속 질문이 들어오는게 많이 부족하게 대답한 듯..🥲 그래서 다시 책을 읽으면서 자세히 정리해보았다. 0. 비동기처리의 환경구조와 용어정리 자바스크립트 엔진(런타임)은 memory heap과 call stack으로 이루어져있다. heap은 구조화되지않는 큰 메모리 영역으로 말한다. 객체는 힙에 할당된다. memory heap은 자바스크립트의 객체(함수,변수 등)에 메모리 할당이 일어나는곳으로 크기가 변하는 값의 참조값을 가지고 있다. wep API는 브라우저에서 구현된 API로, node에서는 background라고 하며, 비동..

Reducer createSlice를 사용하지 않고 순수한 Redux에서의 reducer는 순수 함수로, 현재 상태와 액션을 받아서 새로운 상태를 반환한다. Redux에서는 많은 boilerplate 코드를 작성해야 하고, 액션 생성자와 리듀서를 일일이 정의해야 한다. 개발자는 액션 타입 문자열을 일일이 작성하고 액션 생성자와 리듀서를 따로 만들어야한다. Slice createSlice 함수는 리듀서 함수, 액션 생성자 함수, 초기 상태를 한 번에 생성한다. createSlice는 기본적으로 immer라는 라이브러리를 사용하여 불변성을 유지하는 로직을 자동으로 처리하기때문에 상태를 직접적으로 변경해도 된다. createSlice로 생성된 slice는 자동으로 액션 생성자를 생성하고 액션 타입을 관리하므로..

반응형 웹을 만들어보고싶어서 검색하다 react-bootstrap이라는걸 알았다. 호기심이 생겨서 한번 읽어보고 만들어봄. import { Row, Col } from "reactstrap"; 리엑트 스트랩은 Row라는 전체의 한칸에 크게 한줄이 있다고하면 Col은 그 전체줄을 12칸으로 나눈다. 만약 하나의 Row에 세개의 요소가 있다면 4칸씩 사용하여 배열로 만든것이다 스트래블 사용할때 Row를 사용할거라면 반드시 Col을 넣어주어야한다. npm i node-sass sass-loader scss 파일에 작성한 css를 변환시켜 내가 만든 리엑트앱에 적용해준다. app.js파일에가서 custom.scss 파일을 불러온다. 리엑트에서는 스타일을 어떻게 적용하냐면 클래스네임으로 일반적으로 css의 클래스..

흠.. git hub desktop으로 연결했다가 10k가떠서 폴더를 삭제했는데 바탕화면의 폴더까지 삭제되었다. 휴지통 비우기 전에 확인 해보고 비울껄.. .env파일에 뭐가 있었는지 기억나지않아서 걱정이였는데 다행히 config의 index에 적혀있었다. import dotenv from "dotenv"; dotenv.config(); export default { MONGODB_URI: process.env.MONGODB_URI, JWT_SECRET: process.env.JWT_SECRET, PORT: process.env.PORT, }; 문제는 MongoDB의 비밀번호가 기억나지 않는것;;ㅎ MongoDB Atlas로 다시 접속하자 MongoDB Cloud MongoDB Cloud is a uni..

배포된 서버로 접속했을때 지도가 뜨지 않는 문제가 발생했다. 키가 잘못된건가 싶어서 배포 환경키와 vscode의 키를 비교해봤는데 차이점이 없었다. 로컬로 접속했을때는 잘 뜨는데 고민하다가 도메인이 생각나서 들어가봄 도메인이 로컬로 되어있었다. 이거바꾸고 잘 뜨는 것을 확인하였다.

몽고디비클러스트를 활용하여 몽고디비에 연결해본다. MongoDB: 애플리케이션 데이터 플랫폼 업계 최고의 최신 데이터베이스를 토대로 구축된 애플리케이션 데이터 플랫폼을 사용해 아이디어를 더욱 빠르게 실현하세요. MongoDB는 데이터를 손쉽게 처리할 수 있도록 지원합니다. www.mongodb.com 클라우드에 아틀라스로 들어간다. try free를 클릭 위치는 서울이 있어서 서울로하고 생성하자. 이제 생성이 완료되었다. 생성 완료되면 Quick Strart라며 바로 네트워크 엑세스를 설정하게된다. quick start를 하지않았다면 화면 왼쪽 하단에 NetworkAccess에 설정하면된다. network access에서는 접속할 수 있는 IP를 설정할 수 있다. ADD IP ADDRESS 를 클릭하고 ..

배포할때 백엔드는 AWS EC2를 프론트엔드는 AWS S3를 사용한 배포를 사용했었는데프론트 배포할때 Vercel이 정말 편하다고 들어서 사용해봤다. 1.  Vercel 사이트에 접속해서 회원가입 Vercel: Build and deploy the best web experiences with the Frontend Cloud – VercelVercel's Frontend Cloud gives developers the frameworks, workflows, and infrastructure to build a faster, more personalized web.vercel.com 1.  배포 시작하기가입하면 start deploying을 클릭하고 Import Git Repository 한다.내경우 ..

저번주에도 CORS에러가 떴었는데 그때는 내가 도메인을 잘못입력해서 떴었다. 그리고 3일전만해도 잘 작동하는 것을 봤는데 또 CORS 에러가 터졌다. localhost/:1 Access to fetch at 'http://www.주소.com/location?latitude=37.5054946&longitude=126.7655204' from origin 'http://localhost:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: The 'Access-Control-Allow-Origin' header contains multiple values '*, *', but..