본문 바로가기

study/Challenge

(35)
[Challenge / day-27] 디자인 토대로 레이아웃 구현하기 오늘의 공부범위 : 48강 내용(Part4. ch1. 3강) 목차 1. 디자인에 따라 컴포넌트 제작 오늘은 큰 목차는 하나지만, 소 목차로 React Router를 사용하거나 class diagram을 이용하는 과정이 포함되어 있다. 지금까지 잘 만들어온 디자인을 토대로 앱 개발의 뼈대인 컴포넌트 제작을 성공적으로 마치는 것이 오늘의 목표이다. 대략 이런식으로 CLI를 너무 잘 활용하셔서 하셨는데 docs pwd docs ll docs cp react_component_diagram.plantuml ~/personalWorkspace/dutchpay-fastcampus/docs docs cp sequence_diagram.plantuml ~/personalWorkspace/dutchpay~fastcamp..
[Challenge / day-26] 개발환경 구축 오늘의 공부범위 : 46,47강 내용(Part4. ch1. 1-2강) 목차 1. AWS amplify 2. 개발환경 셋업 #1. AWS amplify 저번에 소개한 AWS amplify를 제대로 활용하기 위해서는 amplify CLI를 설치해야한다고 해서 설치하려고 하였다. 나는 몇 달 전에 가입해둔 것이 있기 때문에 가입하는 것은 생략하고 바로 강사님 따라서 console 화면까지 잘 들어갔다. 그런데, AWS 홈에서 amplify를 직접 검색해서 들어가보니 다음과 같은 화면이 나와서 잠시 당황했다. 어라..? 저는 CLI 설치하고 싶은데요..? 스튜디오랑 호스팅은 아직 안할건데 ㅠㅠ 어떻게 하는지 헤메다가 링크를 강의자료에서 주신 것 같아서 주신 링크로 들어오니 AWS docs 쪽이랑 연결되어서 다행..
[Challenge / day-25] React Router 소개, Recoil 소개, Style 소개 오늘의 공부범위 : 강의 36-8강(Part3. ch2. 6-8강) 목차 1. React Router 소개 2. Recoil 소개 3. Style 소개 오늘 세 개나 소개해야하므로 강의내용을 중심으로 간단하게만 소개해보고 나머지 내용은 공식문서를 항상 읽는 것을 명심해야한다!!(강사님의 가장 중요한 가르침~!!) 오늘 공부도 시작~~ #1 React Router 소개 React Router는 응용프로그램의 URL을 관리하고 URL을 기반으로 다양한 콘텐츠를 표시할 수 있는 널리 사용되는 라우팅 라이브러리이다. React Router는 전체 페이지를 다시 로드하지 않고도 탐색할 수 있는 단일 페이지 응용프로그램(SPA)을 만들 수 있도록 도와준다. 하는 일을 요약하면 다음과 같다. History 스택을 관..
[Challenge / day-24] 기술셋 선정하기 - DevOps, AWS amplifier 소개, React 소개 오늘의 공부범위 : 강의 33-5강(Part3. ch2. 3-5강) 목차 1. 기술셋 선정하기 - DevOps 2. AWS amplifier 소개 3. React 소개 #1 기술셋 선정하기 - DevOps (1) DevOps 란? Development + Operation의 합성어로서, 소프트웨어 개발에서 배포까지.. 전달(delivery) 과정을 자동화 하고 빠르게 하여 결국에는 비지니스의 가치를 높일 수 있도록 하기 위한 개발 환경이나 문화를 말한다. DevOps는 기존의 소프트웨어 개발 방식과 운영 방식을 통합하여 빠른 속도로 소프트웨어를 제공하고, 신속하게 문제를 해결하며, 고객 요구 사항을 빠르게 수용하고 반영하는 것을 목표로 한다. DevOps는 기존의 소프트웨어 개발 방식에서 개발팀과 운영팀..
[Challenge / day-23] 기술셋 선정하는 기준, 프론트엔드 기술셋 선정하기 오늘의 공부범위 : 강의 31,2강(Part3. ch2. 1,2강) 목차 1. 기술셋을 선정하는 기준 2. 기술셋 선정하기 - 프론트엔드 오늘의 블로깅 모습..!! #1 기술셋을 선정하는 기준 1. 올바른 기술셋 선정하기 새로운 기술들이 정말 빠른 속도로 나오고있는 요즘 시대에 어떤 기술셋을 사용할지 선정하는 것은 더욱 중요한 문제가 되었다. 프론트엔드라는 개념도 잘 없던 예전에는 패러다임이 되는 기술이 거의 한 두개 정도 였을텐데 요즘은 기술 하나에 같이 사용되는 라이브러리만해도 한 두가지가 아니기 때문에 더더욱 중요한 문제이다. 2. 올바른 기술셋이란 무엇일까? 내가 사용하고 싶은 기술이 아니라, 시스템 요구사항을 충족하는데 적합한 기술! 3. 올바른 기술셋 선정이 중요한 이유 기술셋 선정에 따라 개..
[Challenge / day-22] class diagram 실습 오늘의 공부범위 : 강의 30강(Part3. ch1. 7강) 목차 1. React component 생성 팁 2. class diagram 실습 솔직히 챌린지 초반에는 의무적으로 하는 기분도 많이 들었는데, 저번에 sequence diagram 실습 이후로 점점 뿌듯한 기분도 들고 새로 배우는 것들이 많아서 기분이 좋은 것도 있어서 더욱 열심히 참여하게 되었다. 오늘은 클래스 다이어그램을 그려보자. 그러기에 앞서서 컴포넌트를 만드는 법을 알려주시면서 디자인패턴도 소개해주시고 🥹🥹🥹 이번 시간도 명강이다 명강!! 집중해서 따라가보자~!!! #1. React component 생성 팁 페이지 별로 컴포넌트를 정의하는데, UI 디자인을 살펴보면서 공통적인 요소가 있는지 파악해서 반복적으로 사용할 수 있는 요소..
[Challenge / day-21]Architecture diagram, Sequence diagram 실습 오늘의 공부범위 : 강의 28강,29강 내용(Part3. ch1. 5강,6강) 목차 1. Architecture diagram 실습 2. Sequence diagram 실습 이번 시간에는 먼저 배웠던 두 가지 다이어그램을 실습해보면서 차이점도 느껴보고 조금 더 이론에 대한 깊은 이해를 할 수 있는 시간을 가져보겠다. 아 분명 아키텍쳐 다이어그램 실습에 관해서 정말 잘썼는데 한숨 자고 일어났더니 다 날아갔다...하.. #1. Architecture diagram 실습 결과물이 좀 초라해 보일 수 있지만, 향후 발전가능성이 있는 결과물임을 참고해주기 바란다. Architecture diagram은 두 가지만 기억하면 일단 그릴 수가 있었다. 1. 구성요소 나열하기 2. 구성요소 간 상호작용 그리기 이번에 L..
[Challenge / day-20] 시스템 이론(3) class diagram 오늘의 공부범위 : 강의 27강(Part3. ch1. 4강) 목차 1. class diagram 2. class diagram 실습 오늘은 특별히 강의를 건너뛰어서 수강해보려고 한다..!! 순서대로 웬만하면 듣겠지만 이론을 듣고 바로 실습을 안하면 기억에서 하루만에도 빨리빨리 사라지는 것 같아 오늘 클래스 다이어그램을 듣고 실습한 뒤 내일 시퀀스 다이어그램과 아키텍쳐 다이어그램을 실습해보려고 한다. 오늘도 성실하게 필기하면서 시작해보자. #1. Class diagram 개념 클래스 다이어그램(class diagram)은 객체 지향 프로그래밍(OOP)에서 시스템이나 응용 프로그램의 구조를 설명하는 데 사용되는 다이어그램의 한 유형이라고 한다. 클래스 다이어그램에서 클래스는 유사한 특성과 동작을 가진 개체의..