본문 바로가기

반응형

: Front-end

(4)
GitHub Actions 이용하여 React 프로젝트에 Prettier 적용하기 Add Prettier on React App Using GitHub Actions Table of Contents 1. What is Github Actions 2. Apply Actions in github 3. node.js.yml 3.1. on 3.2. build 3.2.1 runs-on 3.2.2 Specifying the Node.js version 3.2.3 Installing dependencies 4. Actions in my project 1. What is Github Actions 공식문서에서는 다음과 같이 소개한다. Automate, customize, and execute your software development workflows right in your repository..
[React] Material UI React - Material UI Contents 1. Material Design 2. Getting Started 2.1. Installation 2.2 Button Component 2.3 Theming 1. Material Design Material은 구글에 의해서 개발 된 시스템이다. 나사, 스포티파이, 넷플릭스, 아마존, 유니티 등 당신이 아는 유명한 기업들도 다 사용한다! 그래서 이게 뭐냐? 훨~씬 쉽게 웹 개발을 하도록 도와주는 리액트 컴포넌트이다. Material UI는 Material Design을 사용한다. https://material.io/design Material Design Build beautiful, usable products faster. Material Desig..
[React] 리액트 빈 프로젝트 만들기 리액트 시작하기 Getting started with React (node@16, TypeScript) React는 무엇인지 알아보고 시작하도록 하자. Javascript 언어를 기반으로 한, 유저 인터페이스를 개발하기 위한 Library Framework가 아닌 Library 이다. Framework라 함은 정해져있는 틀들을 반드시 구성한 다음, 우리가 필요한 기능을 구현해야하지만, React의 경우는 우리가 필요한 기능만 가져다 쓰면 된다. VDOM(Virtual Document Object Model, 이하 VDOM) 사용한다. VDOM은 가상적인 표현을 메모리에 저장하고, 실제 DOM에 동기화하는 프로그래밍의 개념이다. 쉽게 말하면, 복잡한 변화가 있을 때, DOM은 계산하고 리렌더링을 해야한다...
nodenv 이용해서 npm 설치하기 ※ nodenv란? (What is nodenv) 우선 nodenv는 node version control system 이다. 한 피씨에서, 여러 노드 버전을 이용하기 위해서 사용하는 것이다. 한 프로젝트만 진행하는 경우에는 별 상관이 없지만, 여러 프로젝트를 동시에 진행하다보면, npm version dependencies가 생기기 마련이고 이를 해결하기 위함이다. ※ node install --global 에러 해결 방법 Permission error Missing write access to /usr/local/lib/node_modules 1차원적으로는 sudo 권한주면 해결 될 것 같은데, 따로 폴더 만들어서 관리하는 것을 추천 docs.npmjs.com/resolving-eacces-permi..