분류 전체보기28 npm을 이용해서 create react app설치 터미널에서 npm install -g create-react-app npm install -g create-react-app -g는 글로벌하게라는 뜻 권한이 없어서 에러가나면 sudo npm install create-react-app sudo npm install create-react-app 잘 설치되었는지 확인하기 위해서 create-react-app -V 공식문서에서 npx를 사용하라고 되어있는데 왜 그러냐면 npm은 프로그램을 설치하는 것이고 npx는 한번 쓰고 삭제하는 것임. 실행할 때마다 최신버전이라는게 장점임. ➜ ~ cd /Users/sung_eun/Desktop/programming/ot-react-app ➜ ot-react-app git:(master) ✗ create-react-ap.. 2021. 1. 28. 210122 TID - Git 오늘 한건 3가지다. 1. 일단 예전에 했던 브랜딩 작업이 pdf로 만들어져있는데 웹포폴 사이트에 올리고 싶었다. 그래서 세로형으로 정리하고 웹페이지로 만들었다. 밑에 짤막한 모션을 추가하였다. 2. 어제 공부하던 git을 다시 봤다. opentutorials.org/course/3839/22593 버전간의 차이점 비교 - 생활코딩 수업소개 버전관리를 하게 되면 버전과 버전 사이의 비교를 할 수 있습니다. 이를 통해서 의사결정을 하는데 큰 도움을 받을 수 있습니다. 강의 opentutorials.org 여기부터 봤다. git diff 새로 바꾼 코드가 어떤 차이점이 있는지 보여준다. git reset --hard 이전 버전으로 돌립니다. git log -p p는 패치라는 뜻이다. 파일이 버전간 무엇이 바.. 2021. 1. 23. 210121 TIL - git (version) 나는 전에도 git을 사용하고 있긴 했었다. 개인 프로젝트를 협업 할 때도 그냥 레파지토리 하나 만들어서 commit 하고 바로 push해서 썼었다. 내가 만들어놓은 포트폴리오 템플릿도 다른 사람이 풀/다운로드 해서 사용할 수 있도록 하기도 했었다. 하지만 그냥 코드를 외우고 사용하고 있었고 정확히 깃이 어떤 동작을 하는지 모르고 있었다. 협업을 할 때도 팀 프로젝트를 풀 해 와서 나는 내 브렌치에만 푸쉬를 하고, 브렌치를 합치는 것은 프로젝트를 관리하는 PM이나 CTO가 했다. 그리고 나는 그 프로젝트를 풀 해서 사용을 해 왔다. 터미널 창에서 내가 많이 사용했던 명령어들은 1. 깃의 로그들을 볼 때 -> 이렇게 보면 더 깔끔하게 볼 수 있다. 이 레파지토리에 속한 모든 브렌치의 상태를 확인할 수 있다.. 2021. 1. 22. html 파일 내에서의 script tag 위치 처음 html css를 배울 때 테그를 일반적으로 body가 끝나는 곳에 위치하라고 배울테지만 이렇게 했을 경우 문제가 생길 때가 있다. html, css를 javascript로 조작해서 스타일을 만드는 경우는 테그를 body가 시작하기 전 head에 위치를 시켜야 한다. 안그렇고 일반적으로 하던대로 body뒤에 위치하는 경우 document가 이미 html css로 화면을 그린 이후이기 때문에 스타일을 조작하는 javascript가 실행되어 보이지 않을 경우가 있었다. 그 외의 동작과 데이터의 처리를 담당하는 javascript의 파일은 body 뒤쪽에 위치를 시킨다. 보통 js파일들은 무거워서 읽는데에 시간이 오래 걸리는데 이렇게 하지 않을 경우 document를 js부터 읽느라 빈 화면이 오래 떠 .. 2021. 1. 20. 글래스모피즘 디자인을 실현하기는 불가능한가. 왜 background blur는 viewport의 가장자리는 어두워지는걸까... 포트폴리오를 만드려고 개발 삽질을 하고 있다. 과연 이 삽질이 의미 있을지는 잘 모르겠지만... 글래스모피즘 같은 디자인을 사이트에 반영하기 위해 background blur로 글래스 모피즘스럽게 블러가 많이 들어간 시안이 웹에서 어느정도까지 구현이 가능할지 테스트 해보고 있다. 테스트 해볼 시안은 이렇다. 보면 블러를 준 가장 위에 있는 오브젝트는 투명하다. 하지만 이걸 웹에다가 적용을 해보니 블러를 먹인 오브젝트는 화면 가장자리가 어두워진다. 이렇게되면 어두침침한 오브젝트 때문에 깔끔한 글래스모피즘 디자인이 나오지 않는다. 브라우저 문제인가 해서 사파리를 테스트 해봤는데 동일하다... ... 시안을 수정해야겠다. ㅜㅠ .. 2021. 1. 19. 웹사이트에 GA(Google Analytics) 사용하기 / GA와 Google Tag Manager연결하기 웹 사이트를 디자인을 했지만 어떻게 사람들이 이 사이트를 이용을 하고 있는지 모르겠네요 . 그래서 사람들의 이용을 추적을 하고 싶어서 GA랑 테그 메니저를 공부하려 합니다. 우리가 보는 웹사이트는 디자인되어 있지만 안을 까보면 소스코드로 생성되어 있습니다. 이 소스코드 안에 데이터 추척 코드를 넣어야지 데이터 추적이 가능 합니다. 물론 소스코드를 볼 수 없는 남의 사이트는 데이터 추적이 불가능 하겠죠. 여러분의 웹이나 블로그만 트래픽 추적이 가능합니다 추적 코드를 삽입을 하고 약 3-4시간 텀으로 추적이 딜레이가 있으니 참고 하세요. 회사 사이트는 있지만 거기에 소스코드를 잘못 건드렸다가는 큰일 나므로 딱히 소스코드를 넣을만한 웹사이트가 없군요. 그래서 제 죽어가는 티스토리 안에다가 GA 추적 코드를 넣.. 2021. 1. 19. 이전 1 2 3 4 5 다음
