전체 글 190

'22.04.22 Today I Learned

오늘은 팀 프로젝트 발표날이기도 했고 팀 프로젝트에 내가 맡은 기능을 어제 미리 다 구현을 해 놔서 따로 기억에 남는 학습 내용은 없는 것 같다. 마크다운 문법을 사용할 때 테이블을 작성하는 법을 배운 것이 굳이 뽑자면 기억에 남는 것 같다. 다만 git에서 브랜치를 main, dev 두 개를 만들어놓고 팀 레포에 새로운 머지가 있으면 upstream을 한 다음 내 로컬 환경에 pull을 해오면 파이썬 환경설정이 다 초기화 되는 경험을 했는데 이 부분에 대해서 조금 더 찾아볼 필요가 있는 것 같다.

내일배움캠프 Team Harmony 미니 프로젝트 회고

KEEP(이번 프로젝트에서 잘 된 것 -> 유지하고 싶은 것) PROBLEM(문제점 + 해결방안) TRY(다음 프로젝트를 위해 해야할 노력, 시도해보고 싶은 것) KEEP - git 환경 잘 만들어서 큰 충돌 이슈 없이 프로젝트가 진행이 잘 되었다. - 각자 맡은 기능이 구현이 될 수준까지 잘 마무리 되었다. - 기한 엄수를 잘 지킬 수 있었다(1등!) - 팀원 간에 피드백이 잘 되었다. - 커밋 메시지 통일, 코딩 컨벤션 통일, git flow 통일 -> 이건 앞으로 계속 유지! PROBLEM (1) 문제점 - 기획이 실제 서비스를 할만큼 적합하지 않았다. - 짧은 시간 안에 기능 구현을 해야돼서 개발 템포가 너무 빨라 충분히 학습을 하고 코드를 작성할 수 없었다. - 각자 개발시간이 모자라서 다른 팀..

'22.04.21 Today I Learned

- api를 호출하는 두 가지 방식(성능 측면) - python의 f string - 협업할 때 git 이용하는 방법 - api 모듈화 해서 작업 하는 법 1. api를 호출하는 두 가지 방식(성능 측면) api를 호출하는 방식에는 두 가지가 있다. - 클라이언트단에서 바로 api를 호출해서 데이터를 받아오는 방식 - 서버에 일단 api 데이터를 받고 그것을 서버에서 제공해주는 방식 미니 프로젝트를 하며 open api를 사용하고 있는데 클라이언트단에서 바로 open api를 호출해서 데이터를 받아 화면에 보여주려고 하니 로딩시간이 너무 길다는 문제가 생겼다. 그래서 서버에 관련 데이터를 받을 수 있는 api를 하나 만든 다음에 그 곳에서 우선 데이터를 받고 내가 만든 api를 클라이언트단에서 호출하는 ..

'22.04.20 Today I Learned

- git branch의 개념과 협업 시 git을 어떻게 사용해야되는지 본격적으로 팀 프로젝트를 하기 위해서 팀 레포지토리를 만들고 그 레포지토리를 fork 해서 clone 하는 것까지 했다. 그리고 git flow에 대해서 팀장님이 설명을 해주셨다. git flow란 협업 시 어떤 흐름에 따라 커밋을 하고 푸시를 하고 머지를 하는 등 전반적인 git 사용의 흐름을 의미한다. 협업을 한 번도 해 본 적이 없어서 git을 사용하는 것이 많이 낯설어서 아직까지도 git으로 뭘 하기 전에는 조금 손이 떨리는 거 같기도 하다😂 협업을 할 때는 보통 main 브랜치는 거의 건드리지 않고 새로운 브랜치를 만들어서 그 브랜치에서 작업을 하고 최종적으로 main 브랜치에 merge를 한다고 한다. 새로 만드는 브랜치는..

'22.04.19 Today I Learned

- 팀 repository를 만들고 거기에 공동 작업을 하는 것 - git fork를 하고 git clone을 해서 commit 하고 push 하는 것 - gitignore의 개념 - pull request 와 merge - 팀 단위로 S.A를 만들어보고 API 설계를 하는 것 1. 팀 repository를 만들고 거기에 공동 작업을 하는 것 + git fork를 하고 git clone을 해서 commit 하고 push 하는 것 팀 프로젝트 경험이 하나도 없는 나에게 팀 repository를 만들고 같이 공동 작업을 한다는 것이 신선하면서도 약간은 어려웠다. 그렇지만 개발자는 팀 단위로 일을 하기 때문에 익숙해질 필요가 있는 것 같다. 이 과정에서 새롭게 fork란 무엇이고 clone을 해온 뒤에 커밋을..

'22.04.18 Today I Learned

- 웹 개발 종합반(기초) : 1주차 6강까지 - git 개념과 사용법 1. 웹 개발 종합반(기초): 1주차 6강까지 (1) 브라우저: 서버에 요청을 하고 서버가 주는 것을 받아와서 사용자에게 보여주는 역할을 담당함. (2) HTML / CSS / JS : HTML은 웹 사이트의 뼈대를 구성함, CSS는 만들어진 뼈대를 보기 좋게 꾸미는 역할을 담당함, JS는 웹 사이트가 동적으로 움직이게 함. HTML의 많은 태그들, CSS의 속성들은 외워서 하는 것이 아니라 필요한 것을 그 때 그 때 찾아가는 방식으로 코딩을 하는 것이 효율적이다. (어차피 다 외울 수도 없다😂) 2. git 개념과 사용법 (1) git 개념 git은 형상관리도구이다. 형상관리도구란 파일의 버전을 관리해줄 수 있는 도구를 의미한다. ..

React - Redux 5

리덕스에 있는 state를 꺼내쓰려면 state를 props화 해주는 함수를 사용해야하는 등 코드가 조금 복잡해집니다. 이것을 간단하게 해주는 방법에 대해서 알아보겠습니다. 1️⃣ useSelector 훅 사용하기 우선 useSelector 훅을 사용하기 위해서는 우선 import를 해줘야 합니다. import {useSelector} from 'react-redux' 를 import 해주는 곳에 입력해줍니다. useSelector는 다음과 같이 사용합니다. const state = useSelector((state) => state); useSelector를 사용하면 그 자리에 redux state가 남게 됩니다. 그것을 변수에 할당해서 사용하는 것입니다. 콜백함수의 파라미터 자리에는 파라미터가 한 개..

React 2022.01.26

React - Redux 4

리덕스에서는 state를 reducer 함수에 저장하고 그것에 대한 수정방법을 같이 저장해놓은 다음 state 수정 동작을 하는 곳에서 dispatch()를 이용해서 state를 수정했었습니다. 그런데 dispatch는 또 다른 기능을 할 수가 있습니다. 바로 dispatch 할 때 데이터를 전송하는 것입니다. 이에 대해 공부해보겠습니다. 1️⃣ dispatch 이용해서 데이터를 보내는 법 dispatch는 보통 이렇게 사용했습니다. props.dispatch({type: '추가'}) 그런데 이 기능에다가 추가해서 데이터를 보내는 방법은 무엇일까요? dispatch를 이용하여 데이터를 보내기 위해서는 다음과 같이 하면 됩니다. props.dispatch({type: '추가', payload: {name:..

React 2022.01.26

React - Redux 3

리덕스를 사용하기 위해서는 state를 reducer에 넣고 reducer를 store에 저장했습니다. reducer에는 state를 수정하는 방법도 담겨져 있었습니다. 그렇다면 state를 하나가 아니라 여러 개를 만들고 싶다면 어떻게 해야될까요? 이에 대해 공부해보겠습니다. 1️⃣ state 하나 더 만드는 법 state를 처음에 만든 방법과 동일하게 만들면 됩니다. state를 변수에 담아서 하나 더 만들면 됩니다. useState 같은 것들을 사용하지 않아도 됩니다. 2️⃣ reducer 하나 더 만드는 법 state를 하나 더 만들었으니 reducer도 하나 더 만들어줘야 합니다. 리덕스에서 state와 reducer는 세트 개념이라고 생각하면 좋습니다. reducer를 하나 더 만드는 법도 역..

React 2022.01.26

React- Redux 2

리덕스를 쓰는 이유는 크게 두 가지입니다. 첫째는 props를 사용하지 않고 데이터를 전송하기 위함입니다. 둘째는 오늘 공부해 볼 내용인 상태관리에 유용하기 때문입니다. 리덕스에서 상태관리를 하는 법에 대해서 공부해보겠습니다. 리덕스에서 데이터를 수정할 때는 useState를 사용했을 때 자동으로 생성되는 state 변경함수를 사용하지 않습니다. 리덕스를 통해 데이터를 수정하는 방법은 두 단계로 나뉘어져 있습니다. index.js 에 reducer 함수를 만들어 줍니다. 원하는 곳에서 dispatch 함수를 통해 reducer 함수에서 미리 정의한 데이터 수정방법을 불러옵니다. 1️⃣ reducer 함수 만들기 reducer함수는 index.js에 생성합니다. reducer 안에는 stated의 초기값과..

React 2022.01.25