본문 바로가기

클론코딩3

[Team project] 🍿MEGAFOX 🎞 - 회고 MEGAFOX 팀 프로젝트 📆 진행 기간 2021.10.18 ~ 2021.10.29 💻 기술 Front-end View : React Build Tool : Create React App Library : react-router-dom Styled Components (with css3, sass) Code Quality Tool : ESLint, Prettier Back-end Python, Django, MySQL Infrastructure : AWS 🖇 사용 협업 툴 VCS : Git & Github Communication : Slack Task Management : Trello 🦊 팀원별 역할 Front-end github 공통 CRA 초기 세팅 강단 header(Nav, 유저 정보 등 확인 .. 2021. 10. 31.
[Team project] 🍿MEGAFOX 🎞 - 초기세팅 1. CRA 설치 // 1. Desktop - 프로젝트 생성할 폴더로 진입 cd Desktop/wecode // 2. 프로젝트 설치 npx create-react-app westagram-react // 3. 프로젝트 진입 cd westagram-react // 4. 로컬 서버 띄우기 npm start 2. 불필요한 파일 삭제 3. react-router 라이브러리 설치 npm install react-router-dom --save 4. node-sass 모듈 설치 후 제거 - 이번엔 styled-components 사용 할 것 npm install node-sass@4.14.1 --save npm uninstall node-sass 5. styled-components 모듈 설치 (styled-com.. 2021. 10. 18.
[clone project]Danstagram - html, css 첫 클론 프로젝트 Danstagram★ 먼저 clone을 하기에 앞서 내가 이 프로젝트에서 무엇을 얻어갈 것인가에 대한 리스트 업을 했다. ✅ 우선 순위 html - 시멘틱 구성 : 왜? 그 위치, 그 태그를 사용했는지 고민하며 작성하기 css - flex속성 능숙하게 사용하기 css- float:left에 대한 의존도 줄이기 ☓☓ 우선 순위 아닌 것 (= 시선 뺐기지 말 것 제발..) 반응형 욕구 "똑.같.이"의 구현의 집착 (픽셀 크기 , 폰트 스타일 등) common - css @import url('https://fonts.googleapis.com/css2?family=Lobster&display=swap'); *{ box-sizing:border-box; margin:0; padding:0; .. 2021. 9. 12.