본문 바로가기

전체 글

 (60)
[코드스쿼드] 9주차 회고록(1주차 프로젝트) 협업 프로젝트 시작이번에 4주짜리 협업 프로젝트를 시작하였다. 프론트엔드 2명, 백엔드2명, ios 2명으로 구성된 총 6명의 팀!그 전부터 협업을 하면 어떻게 해야할지 참 고민이 많았다. 어떤 식으로 소통하고, 어떤 식으로 협업하면 좋을지. 그런데 이번에 같은 팀 중에 한 분이 프로젝트를 엄청나게 많이 하신 분이 계셨다. 그래서 이 분이 전체적인 틀을 잡아주셨다.우선은 팀원간의 소통은 slack을 이용하고, 전체적인 스프린트 계획이나 공통 내용 등 한 눈에 보여야하는 부분은 노션을 이용해서 소통을 하기로 진행하였다.회의의 연속이번 주는 그냥 계속 회의를 했던 거 같다. 정해야할 일이 왜이렇게나 많은지, 전체 팀이랑도 회의하고, 프론트엔드 팀끼리도 회의를 해야했다. 그라운드 룰, 스크럼 룰, 식사 룰, ..
[코드스쿼드] 6주차 회고록 이번에는 크롱과 멘토링 시간을 가졌다. 그동안 고민했던 부분을 크롱과 이야기하면서 많은 부분을 알게되었다. 협업이란? 이젠 앞으로 백엔드와 협업할 부분이 많을텐데, 어떻게 협업을 하는게 궁금했다. 전에 프로젝트를 진행하면서 백엔드와 협업을 했었는데, 결국에는 딜레이 되다가 그 분이 취업을 해서 혼자 맡아서 진행을 한 적이 있다. 이때 협업하면서도, 어떻게 백엔드와 진행 사항을 공유해야하는 걸까 고민했었는데, 처음 프로젝트를 진행하다보니, 이 점이 미숙했던 거 같다. 그래서 크롱한테 어떻게하면 좋은 협업을 할 수 있는 지 물어봤다. 협업을 할 때 제일 중요한 부분은 서로 커뮤니케이션을 많이 해야한다는 것이었다. 팀으로 보면 전체 일정이 한 눈에 보여야 한다고 했다. 구체적으로 어떤 기능은 언제 완료할 것인..
[코드스쿼드] 5주차 회고록 5주차 설계 먼저 이번에는 코드 먼저가 아니라 설계부터 먼저 작성을 해보기로 하였다. 그 전 프로젝트에서는 무지성으로 코드를 짜다보니깐, 변수명과 class name들이 뒤죽박죽이었다. 이름보고 어떤 기능인지 알아야하는데 나중에는 이름을 봐도 내가 모르는 사태가 발생하였다. 앞으로 이름이 방대해질텐데… 그럼 더 큰 문제가 발생하기 때문에 이 점은 짚고 넘어가야겠다. 그래서 피그마로 뉴스스탠드 화면을 박스를 치면서 구성을 짜보았다. 이렇게 하다보니, 어떤 식으로 나누고 어떤 식으로 묶으면 좋겠는 점이 시각적으로 보여서 좋았다. 박스친 화면 구성도를 보고 아래처럼 설계도를 작성하였다. 그러다 보니, html 구조를 어떤 식으로 작성하면 좋을지 한 눈에 보여서 좋았고, BEM을 고려하면서 나만의 규칙을 적용해..
[코드스쿼드] 4주차 회고록 4주차 어떤 걸 중점적으로 잡고 가야할까 개념 정리 궁금한게 생기면 찾아보는데 따로 정리는 하지 않고, 이렇구나 하고 그냥 코드에 적용시키는데 그러다보니깐, 왜 이렇게 작동하지?하고 구체적인 부분을 모른다고 생각이 든다. 그래서 개념을 딥하게 파봐야지!하고 파다보니, 끝도 없이 꼬리를 꼬리를 물게 되고, 미션 구현을 할 수 있는 시간이 그만큼 적어지게 된다. 미션 구현 미션 구현에만 또 집중을 하다보니 개념을 모르니깐 아 개념 공부해야하는데… 이런 생각이 든다. 약간 무한 굴레 같은 느낌이다. 디테일함 크롱이 디테일함에 대해 말해주셨다. 한 기능을 만들더라도 이렇게까지 디테일하게 만든다고? 생각이 들었던 기업이 있었다고 말씀해주셨다. 그 이야기를 듣다보니 디테일함이 중요하다는 생각이 들었다. 나중에 정해..
[코드스쿼드] 3주차 회고록 3주차 3주차는 정말 다산 다난했던 한 주였던 거 같다. 계속 여러가지를 시도해보았다. 리팩토링하다가 이러다가 정말 리팩토링의 늪에서 못 빠져나올 거 같아서, 개념 정리를 해보았다. 화면을 구성할때 마음가짐 crong이 공부해야 하는 것들 중에서 html 시멘틱 태그와 웹 접근성이 있었는데 시맨틱 태그에서는 변수명의 중요성을 강조하였고, 웹 접근성은 소외된 계층이 생기면 안된다는 점을 강조하였다. 처음 웹 접근성을 살펴보기 전에 화면 구성에 대해 단순하게 생각을 하였는데 살펴보고 나니 여러 요소를 고려해야 한다는 점을 깨달았다. 예를 들어 시각장애인들을 위해서 대체 텍스트를 달아야한다던가 깊게 들어가보니 고려 요소가 끝도 없었다. 그래도 웹 접근성을 공부해보면서 어떤 마음 자세로 화면을 구성하면 좋을 지..
[코드스쿼드] 1~2주차 회고록 1주차 처음 코드스쿼드에 오프라인으로 방문한 날이였다. 사람들도 다들 친절하고 금세 어울렸다. 이번에 클론 프로젝트를 진행하였는데, 개념 학습보다 우선은 미션 구현 하는 것 에 급급했던 1주였다. 처음으로 html을 이용하고 css를 이용하여 화면을 구성해보았다. 이번 한주는 무지성으로 코딩을 하다보니, 이러면 안되겠다는 생각이 문득 들었다. 2주차 html class명 고민 1주차 때 무지성으로 코딩했던 게 2주차때는 발목을 잡았다. class 명을 지었는데 이게 무슨 기능을 하는지 전혀 모르겠고, html 구조를 봐야지만 무슨 기능을 하는지 알 정도였다. 이러면 안되겠다고 생각이 들어서, 제 3자가 봐도 알아 볼 수 있을 정도로 class명을 구성해봐야겠다는 생각을 해서 bem에 대해서 자세히 알아봤..
.yarn 디렉토리가 없는 경우 ## yarn을 이용한 cra 만들기 ``` javaScript yarn create react-app basic ``` 만들고 폴더에 들어가보니, .yarn 폴더가 없는 것을 발견하였다. 왜 없을까 찾아보니, yarn의 버전 문제였다. ### 원인 버전이 낮으면 제대로 폴더가 생성되지 않는데, 살펴보니 내 버전은 1로 시작했다. 1로 시작하면 낮으 버전이라고 볼 수 있다. ### 해결 방법 1. 기존 디렉토리를 삭제하고, 버전을 업데이트 해야한다. 버전을 업데이트하는 방법은 두가지가 있는데 ``` > yarn set-version latest //최신 버전 다운로드 > yarn set version stable //최신 버전으로 업데이트 ``` 두가지 중에서 한가지를 선택해서 업데이트 하면 된다. 저는..
[JS] Number()와 parseInt와 차이점 알고리즘 문제를 풀면서 형변환을 하기위해서 Number()와 parseInt()를 많이 사용하는데, 쓰는 와중에 이 둘의 차이점이 무엇인지 궁금해져서 학습을 하게 되었다. Number(str)란 문자열을 인자로 받으면 해당 문자열을 숫자로 형변환을 시켜줍니다. //1. 문자열을 숫자로 변환 let number = Number("187")//187 //2. 숫자와 문자가 섞여있는 문자열의 경우 let number = Number("580원")//NaN //3. 소수점의 숫자인 경우 let number = Number("19.345")//19.345 ## parseInt(str)란 - Number(str)와 동일하게 문자열을 인자로 받으면 해당 문자열을 숫자로 형변환을 시켜줍니다. ``` javascript..

티스토리툴바