2021의 게시물 표시

Windows에서 WSL로 React 개발 환경 구축하기

이미지
그동안 Unity 3D와 C#을 위주로 개발을 했는데, 갑작스럽게 프론트엔드와 백엔드까지 하게 되었다. 평소 공부할 때는 MS Word에 정리하지만, 프론트엔드와 백엔드는 오픈된 기술이라 블로거에 정리해보기로 하였다. React + TypeScript 기반으로 프론트엔드와 백엔드를 개발해야 하는데, 개인적으로는 윈도우보다는 리눅스에서 개발 환경을 쉽게 구축할 수 있었다. 최근 윈도우에 탑재된 WSL을 사용하면 편리하게 우분투를 사용할 수 있다는 소식을 접하고 개발 환경을 설치해봤다. 결론적으로 매우 만족스럽게 사용하고 있다. VMWare나 VirtualBox에 비해 압도적으로 사용하기 좋았다. 1. WSL (Windows Subsystem for Linux) 설치 먼저 윈도우에 WSL이라고 하는 것을 설치해야 한다. 쉽게 말해 윈도우에서 제공하는 Linux 가상 머신이다. 근데 윈도우에 맞게 약간 커스텀이 되어 있는 것 같다. 최신 버전은 WSL 2이며, 설치 방법은 Microsoft 웹페이지에서 확인할 수 있다. Windows 10에 Linux용 Windows 하위 시스템 설치 가이드 2. Ubuntu 설치 <그림> Microsoft Store에 등록된 Ubuntu Ubuntu를 설치하는 방법은 Microsoft Store에서 Ubuntu를 원하는 버전을 선택하여 설치하는 것이다. WSL이 설치되어 있어야 동작한다는 점에 유의한다. 3. node.js, npm (node package manager) 설치 React를 사용하려면 node.js 10.16 이상 버전과 npm 5.6 이상 버전이 설치되어 있어야 한다. 다음과 같이 커맨드를 입력한다. 1 2 $ sudo apt update $ sudo apt install npm cs npm을 설치하면 node.js도 같이 설치된다. 설치 후에 react를 사용할 수 있는 node, npm 버전인지 확인해야 한다. 다음과 같이 커맨드를 입력한다. 1 2 $ node  - - version $ npm