You have not agreed to the Xcode license agreements. You must agree to both license agreements below in order to use Xcode. Press the 'return' key to view the license agreements at '/Applications/Xcode.app/Contents/Resources/English.lproj/License.rtf' react-native 로 앱 개발을 해보려고 XCode 를 설치했더니... 이후 git add . 명령어를 실행하자 다음과 같은 메세지가 뜨면서 안 먹힌다! 대충... Xcode 관련 라이센스에 동의를 해달라는 내용이다. 라이센스 동의를 위해 아래 명령을 입력..
전체 글
백엔드 개발자 | 프로젝트를 하며 겪은 일들을 기록합니다.
[html, css] 자주 쓰는 css 선택자(selector) [html, css] box model [html, css] position - relative, absolute, fixed [html, css] flex - 반응형으로 정렬하기 [html, css] margin: auto - 가운데정렬, 푸터, 헤더, 양 옆에 붙는 내비게이션 margin: auto로 한 가운데 정렬하기 margin-방향 : auto 로 푸터, 헤더, 내비게이션 만들기
ESLint 는 javascript 로 적힌 코드가 js 문법에 잘 맞게 쓰였는지 검사해주고 문법 에러를 명시해주는 툴이다. Prettier 는 나만의 코드 스타일을 만들고 적용하는 툴이다. 예를 들면, 끝에 세미콜론을 꼭 붙이고.. 탭은 2개로 하고.. 줄 띄움은 1개로 하고.. 이런 저런 설정을 할 수 있다. ESLint 를 쓰는 이유는 명확하다. 문법 에러를 잡아주니까! 그런데 Prettier 는 왜 쓸까? 탭, 줄을 몇 줄로하고... 등등은 문법 에러도 아니다. 보기 이쁜 코드라는 이유가 다일까? 생각해보기 보통 규모 있는 프로젝트에 참여한다면, 다른 사람과 협업을 하게 된다. 이때 일관성 있는 코드 스타일은 정말 중요하다. 어떤 사람은 줄 띄움을 3번 하고, 어떤 사람은 2번 하고... 어떤 사..
typescript 는 let, const 면 다 되는 javascript에 string, object, array, int 등의 data type 이 추가된 것이다. React는 javascript 로 작성하는 프론트엔드쪽 라이브러리다. 즉, javascript로 작성해도 문제 없이 돌아간다는 얘기다. 그럼에도 내가 typescript 로 작성하기를 선택한 이유를 말해보려 한다. 굳이? typescript 는 웹 브라우저가 이해하지 못하는 언어라 ts로 작성된 react 프로젝트를 빌드 시 javascript로 다시 변환하는 작업이 추가된다. 그리고 type 을 지정해주지 않으면 계속 'type 좀 지정해라!' 라는 에러를 띄운다. javascript에서는 잘 돌아가던 놈이 잔소리를 해대니, 이게 참...
Error zsh: command not found: ~ 해결 npm 글로벌 설치 후 간혹 커맨드 입력 시 실행할 수 없다는 메시지가 뜬다. 설치 문제가 아니라 윈도우의 환경변수 설정마냥 글로벌 패스를 설정하면 해결됨! 먼저 자신의 글로벌 패스를 찾는다. npm bin -g yarn global -g global path 를 아래 코드처럼 터미널창에 붙여넣으면 된다. export PATH=${PATH}:/Users...global path 이래도 해결이 안 되면 sudo 를 붙인다. sudo npm install -g [ribrary-name] sudo yarn install global [ribrary-name]
[html, css] 자주 쓰는 css 선택자(selector) [html, css] box model [html, css] position - relative, absolute, fixed [html, css] flex - 반응형으로 정렬하기 [html, css] margin: auto - 가운데정렬, 푸터, 헤더, 양 옆에 붙는 내비게이션 flex 는 내용이 방대하여 한 페이지에 다 담기 힘들지만.. 내가 자주 쓰는 개념들만 간단히 정리해보려고 한다. flex 는 html 요소들을 유연~ 하게 정렬하는 css 옵션이다. 얼마나 유연한지 화면 사이즈를 줄이면 알아서 자동으로 유연~하게 정렬하는 반응형도 제공한다... 사용법은 간단하다. 부모 요소에 display: flex; 를 선언해주면 자식 요소들이..
[html, css] 자주 쓰는 css 선택자(selector) [html, css] box model [html, css] position - relative, absolute, fixed [html, css] flex - 반응형으로 정렬하기 [html, css] margin: auto - 가운데정렬, 푸터, 헤더, 양 옆에 붙는 내비게이션 position 은 html 요소의 위치를 설정할 수 있는 css 옵션이다. static 은 기본값으로, html 에 선언된 대로 차곡차곡 쌓이고... relative 는 원래 위치를 기준으로 위치를 설정한다는 옵션, absolute 는 body 를 기준으로 위치를 설정한다는 옵션, fixed 는 body 를 기준으로 위치를 설정하며 스크롤을 내려도 고정이 되는 옵..
[html, css] 자주 쓰는 css 선택자(selector) [html, css] box model [html, css] position - relative, absolute, fixed [html, css] flex - 반응형으로 정렬하기 [html, css] margin: auto - 가운데정렬, 푸터, 헤더, 양 옆에 붙는 내비게이션 box model 이란 웹 element 하나하나가 가지고 있는 공간을 의미한다. css 작업을 하기 위해 필수로 알아둬야 하는 중요한 개념! 쉽게 설명을 하자면, Content 는 눈에 보이는 내용이고 Border 는 우리가 흔히 알고 있는 테두리다. Border 바깥 여백은 Margin 으로 다른 content 간 간격을 조정할 수 있고 Border 안쪽 여백은..