전체 글

VSCode에서 Unity 유니티 자동완성 안 됨 문제 간단 해결!

매일 웹, 앱 개발로 지친 심신을 안정 시키기 위해 유니티로 게임 개발 공부를 시작했다! 하지만 시작부터 난관에 봉착.. 능숙하게 extension 쓱쓱 깔며 내 방보다 많이보는 VSCode로 코딩을 하려고 봤더니...! 자동완성이 안 되는 문제가 발생했다.. 내가 사용하는 테마(OneDarkPro)에서 빨간색은 대체로 '이게 뭔지 모르겠어!' 라는 뜻이다. 문제해결을 위해 찾아봤을 때 주로 나온 것은 .NET이나 extension을 확인해보라는 것이었고 extension은 이미 여러번 재설치해본 상황이었다. 하지만 역시 정답은 공식문서에 있었다.. PackageManager에서 'VisualStudioEditor'를 2.0.20 이상의 버전으로 설치해줘야하는 것... PackageMavager는 Uni..

Nextjs 공식문서로 공부하기 - 동적 라우팅

Dynamic Routes Next.js는 외부 데이터에 따라 동적으로 라우팅 주소를 사용할 수 있는 '동적 라우팅(Dynamic Routing)'을 지원한다. 가장 흔한 예로는 블로그 포스트의 번호에 따라 /post/1, /post/2 이런식으로 나누는 것이다. 구현 방법은 간단하게 [과 ]로 파일명을 감싸면 된다. ./posts/[id].js 이런 식이다. 컴포넌트 이름은 그대로 사용하면 된다. 다음과 같은 형태로 사용할 수 있다. import Layout from '../../components/layout'; export default function Post() { return ...; } export async function getStaticPaths() { //..

Next.js 공식문서로 공부하기 - SSG와 SSR

SSG SSG(Static Site Generation)과 SSR(Server Side Rendering)은 Next.js의 상징이라고도 할 수 있다. 'Next.js를 써본 것 = SSR을 해본 것'이라고 생각한다는 분이 계신다는 얘기도 들었다(!). 하지만 Next.js에서 기본으로 제공하는 것은 SSG이다. SSG란? SSG는 간단하게 이야기하면 build 타임 때 미리 React 컴포넌트를 HTML 파일로 렌더링 해놓는 것이다. 이렇게만 들으면 그게 HTML 파일을 만들어 놓는 것과 크게 다른건지 의문이 생길 수 있다. Next.js의 강력한 기능은 바로 정적 페이지 생성 시 외부 데이터 fetching이 가능하다는 점이다! 이는 `getStaticProps`라는 간단한 함수를 이용하여 구현할 수..

NextJS 공식문서로 공부하기 - 블로그 만들기

Next.js는 프레임워크이다. 프레임워크란 일반적으로 '특정 응용프로그램을 만들기위한 클래스와 라이브러리로 이루어진 뼈대'라고 설명된다. 그냥 도구만 주어지는 라이브러리와는 조금 다르게, 프레임워크의 뼈대(요구사항)에 맞춰 코드를 구성하면 프레임워크가 직접 코드를 호출하여 애플리케이션을 구동하는 것이라고 나는 이해했다. 어쨌든 이러한 프레임워크를 잘 사용하기 위해서는 이 '뼈대'를 잘 이해하는 것이 중요하다. 그리고 이 뼈대를 가장 잘 설명해주는 것은 당연히 공식문서일 것이다. 저번에 Next.js의 원리와 목적을 아주 간단하게 훑어봤으니 이번에는 공식문서의 튜토리얼을 따라 블로그 프로젝트를 진행해보려고 한다. Next.js 시작하기 리액트에 CRA나 Vite가 있는 것처럼 Next.js도 초기 구성 ..

nvm(Node version manager) 사용해서 다른 버전의 node.js 사용하기 - Apple Silicon mac node v14

NVM(Node Version Manager) 기업과제를 진행하다가 요구 사항에 node v14가 명시되어 있는 것을 발견했다. 그동안은 항상 최신 버전에 맞춰 프로젝트를 진행했다보니 다른 버전을 사용할 일이 없었지만 아무래도 서비스를 운영중인 회사에 들어가면 자주 마주치게 될 일일 것 같아 기록해놓는다. 공식 문서 링크 https://github.com/nvm-sh/nvm 사실 위의 공식문서에 트러블슈팅까지 자세히 되있지만 인터넷 세상에 한글로된 문서가 더 많아져야한다고 생각한다!! 이 글은 Apple Silicon M1 Mac OS를 기준으로 작성되었습니다. 설치 방법 curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.3/install.sh |..

NextJS 공식문서로 공부하기 - Next.js 동작 원리

나의 NEXT.JS 입문기 사실 NextJS는 예전에 수강한 리액트 강의에서 블로그 만들기 수준으로 대강 다뤄본 경험은 있었지만 아직 제대로 공부해본 적은 없었다. 마침 진행하던 프로젝트도 끝난 상황이라 잘됐다 생각하여 시작해보기로 마음 먹었다. 따로 강의를 사서 볼까도 했지만, 워낙 NextJS팀의 공식문서가 잘 되어있다는 말을 많이 들었다. 이미 직접 프로젝트로 만들어보며 '우와!' 하는 것은 많이 해봤기 때문에 이번엔 동작 원리부터 제대로 공부해보려고 한다. 최근에 버전 13으로 올라가며 변한 부분도 많다고 들었는데 반영이 안 된 강의가 대부분인 것 같기도 했다. 아마 나만 볼 기록이 될 가능성이 크지만... 누군가 보신다면 부족한 공식문서 번역 + 제가 다시 이해하여 부족한 번역에 첨언한 내용이라..

JSDoc 페이지를 GitHub Page로 배포하기

JSDoc JSDoc's purpose is to document the API of your JavaScript application or library. - Use JSDoc JSDoc은 Javascript의 API Document를 간단하게 만들어주는 라이브러리이다. JSDoc 설치 및 사용 방법 JSDoc은 전역으로(globally) 설치해야한다. (경우에 따라서는 sudo가 필요할 수도 있다) npm i -g jsdoc 사용방법은 간단하다. 적용하기 원하는 변수나 함수 등 위에 /** */스타일의 주석을 작성하면 된다. /** This is a description of the foo function. */ function foo() { } 공식 문서에 자세한 사용법이 작성되어 있다. https..

제로베이스 프론트엔드 스쿨 4기 종강 후기(내돈내산!)

이 글은 소정의 대가 없이 작성되었습니다 제로베이스 부트캠프 종강! 사실 부트캠프는 11월에 종강이었지만 그때부터 한참 협업 프로젝트로 바쁘던 상황이라 후기를 미루고 미루다 이제야 작성하게 되었다. 언젠가 누군가 제로베이스 혹은 다른 부트캠프를 수강하게 될 때 이 글을 본다면 조금이나마 도움이 되기를 바라며 글을 작성해본다. 부트캠프 알차게 활용하는 방법 다른 부트캠프가 다 그런지는 모르겠지만 제로베이스의 경우에는 물가에 내놓는... 방식의 부트캠프였다. 수많은 양의 강의를 모두 수강할 수 있지만, 최소한의 가이드라인만을 제공해주었다(요즘은 조금 달라졌다고 들었다). 매주 진행되었던 코딩 테스트와 1차, 2차 과제라는 최소한의 목표와 슬랙을 활용한 스터디 그룹핑 정도를 제공해주었고 나머지는 모두 수강생들..