서론 1월에 작성하고자 했던 상반기 회고가 벌써 3월이 되어서야 작성을 시작했다. 하반기 회고도 작성해야 되는데... 시간이 너무 없는 느낌이다. 미뤄 온 것들을 풀고 있는 느낌? 시간이 갈수록 머리로 들어간 것이 많아지고 그것들을 응용해서 더 많이 머리에 집어 넣는 느낌이다. 기억을 많이 할 수록 머릿속이 복잡 해질 것이라 생각했는데 아니다. 기억을 많이 할수록 그 기억을 이용해서 더 단순하고 쉽게 기억하고 푼다. 이래서 단계 별 성장이라 하나보다. 참 신기한 것 같다. 이제 회고를 해야 하니 2023년엔 무엇을 했는지 한 번 짚어보자. 2023.01.01 스타트업 재직 2023.04.01 물류 모바일 앱 개발 2023.06.30 퇴사 그러면 이제 하나 하나 어떤 일들이 있었는지 생각해보자. 본론 20..
VUE
문서 링크: https://axios-http.com/kr/docs/intro (한글화 잘 되어있어서 너무 좋아요) Axios란? Axios는 node.js와 브라우저를 위한 Promise 기반 HTTP 클라이언트 입니다. 그것은 동형 입니다(동일한 코드베이스로 브라우저와 node.js에서 실행할 수 있습니다). 서버 사이드에서는 네이티브 node.js의 http 모듈을 사용하고, 클라이언트(브라우저)에서는 XMLHttpRequests를 사용합니다. 위 설명은 Axios 문서 홈에 있는 설명입니다. 쉽게 설명하면 자바스크립트의 기본 http 요청 라이브러리를 쉽게 사용할 수 있게 해주는 라이브러리라는 뜻입니다. 특징 브라우저를 위해 XMLHttpRequests 생성 node.js를 위해 http 요청 생..
Node.js 설치 node.js 홈페이지에 들어가면 최신 lts 버전을 설치할 수 있지만 개발자들은 일반적으로 nvm을 사용해서 노드를 설치합니다. 그래도 들어가 보고 싶다면 → (node.js 홈페이지 링크) https://nodejs.org/ko/ nvm이란? Node Version Manager의 약자입니다. 간단한 명령어로 Node버전을 스위칭, 설치, 삭제할 수 있습니다. 설치 및 사용 방법: https://kjchoi.co.kr/20 nvm-setup.exe를 실행해 설치한 후 node.js의 lts버전 설치(lts버전은 node.js 홈페이지에서 확인 가능) 현재 기준 node 18.12.1이 LST 버전이므로 nvm install 18.12.1 nvm use 18.12.1 node -v ..
루트 폴더에 아래와 같이 폴더 구조를 생성해주세요. css: css를 저장합니다. imgs: png, svg와 같은 이미지들을 저장합니다. js: js svg 파일, 모듈 파일들을 저장합니다. stylesheets: scss, sass 등의 스타일 시트를 저장합니다. 스타일 시트 정리 스타일 시트 구조는 사람마다 의견이 모두 다르므로 사용하면서 편한 대로 구성하시되 기본적인 골자를 알려드리기 위해 아래 가이드를 작성합니다. 아래와 같이 스타일 시트들을 생성해주세요. main.scss : 메인 스타일 시트 파일로써 각 포인트가 되는 scss 파일 임포트, 변수 export의 역할을 합니다. app.vue에 import 해줍니다. @import "./global"; @import "./colors"; @im..
저번 스토어 수업에서 피냐를 설치해보신 것처럼 plugins는 넉스트에서 사용할 라이브러리를 등록하는 역할을 합니다. plugins에 등록하면 라이브러리를 초기화 할 때 각 라이브러리가 의도한 대로 코드가 동작할 수 있게 해줍니다. (글로벌 변수 등록 등) import { PiniaPlugin, PiniaPluginContext } from "pinia"; // pinia에서 초기화 할 때 실행해줄 함수 function MyPiniaPlugin({ store }: PiniaPluginContext) { store.$subscribe((mutation) => { // 스토어 값이 바뀔 때 로그 찍어줌 if (process.env.MODE === "dev") console.log(`[🍍 ${mutation...
요즘 프론트엔드 개발 트랜드에서 스토어는 빼놓을 수 없는 개념입니다. Redux, Vuex… 여러 스토어들을 많이 들어봤을 거에요. 아.. 복잡하다… ㅜㅜ 하지만 우리에겐 🎉pinia🎉가 있습니다. 제가 살면서 본 스토어 중에 제일 쉬워요. 무려 dispatch가 없어요…!!! 진작 이렇게 좀 만들지. pinia를 설치해봅시다. 아래 명령어를 터미널에 입력해주세요. yarn add pinia @pinia/nuxt --save-dev yarn으로 설치하는 이유는 npm으로 설치하면 pinia와 @pinia/nuxt 간의 의존성이 잡혀 있지 않아 에러가 뜹니다. Nuxt는 yarn에 최적화 되어 있습니다. 하지만 우리는 기본에 충실하기 위해 npm을 사용해봐야해요.. ㅜㅜ 그래서 생성된 yarn.lock 삭..