벌써 2주차 일정이 끝나버렸다.. 아침에 일어나는 것이 쉽지않아 쿠팡으로 커피를 대량으로 주문해놓고 일어나서 마시고 오전 9시부터 일정을 따라 공부하거나 페어프로그래밍을 하면서 하루를 시작했다. 첫번째 글을 작성하고 개발공부 선배인 친구에게 보여줬었다. 친구가 메모를 잘 하긴 했는데, 글을 정리할 때 게시글 단위로 쪼개야 나중에 볼 때 편하다는 말과 그 HTML(hyper text markup language)이 markup language이고 , 그거말고 markdown이라는 문법이 존재하는데 개발자들이 문서정리할때 보통 markdown형식을 사용한다고 했다. https://heropy.blog/2017/09/30/markdown/ 이것을 공부해서 마크다운 파일 기반으로 작동하는 블로그를 운영해보라는 피드백을 해주었다. 이렇게 작성하는 것이 나중에 복기하기 위함이기도 하고 , 나중에 무조건 다시 배웠던 개념들에 대해 찾아 볼 때 다른 블로그 웹서핑을 하는거보다 내가 썼던 글을 보는 것이 더 빠르고 좋다고 말해줬다.그래서 좀 최대한 빠른 시일 내에 개념 파트를 만들 계획이다. 변수면 변수 게시글, 함수는 함수 게시글, 코플릿 게시글과 til도 만들고싶다. 이런 좋은 피드백을 해주는 친구가 있다는게 너무 감사하고 힘이 난다. 더욱 열심히 해야겠다는 마음뿐이다. 아 그리고 oh my zsh, iterm2 에 대해서도 설명을 해주었는데 , 터미널 프로그램이다. 테마도 더 이쁘고 git으로 추적중인 폴더면 브랜치 명도 나오고 기능도 훨씬 강력하다고 한다. 그리고 만약 Document폴더 접근하는데 do만 친 다음에 tab누르면 자동완성도 시켜주는 편리함까지..
https://medium.com/@sungchulblog/%EB%A7%A5-%ED%95%9C-%EC%98%81-%EC%A0%84%ED%99%98-%EB%94%9C%EB%A0%88%EC%9D%B4-%ED%95%B4%EA%B2%B0-%EB%B0%8F-%ED%82%A4%EB%B3%B4%EB%93%9C-%EC%B5%9C%EC%A0%81%ED%99%94-ffbe70095ed9
맥을 사용하면서 한/영 전환 딜레이 해결 및 키보드 설정에 대한 링크도 받았다.
https://minimin2.tistory.com/122 이 링크는 iterm과 zsh 설정하는 법에 대한 내용이 담겨 있다는 말을 해주면서 , npm쓰면 이제 편할 것이고 나중에는 yarn이라는것도 쓸 수도 있는데 npm이랑 비슷한 것이라도 알려주었다. 그리고 oh my zsh을 깔면 zshrc파일이 생겨서 나중에 말할 오류를 수정할 수 있다고 말해줘서 너무 고마웠다.
이번 한 주는 시간이 엄청 빨리 간 것 같다. 코드스테이츠를 하면서 하루가 너무 빨라서 부족할 지경이다.
- JavaScript를 배우고 HTML,CSS 기초를 공부하였다
크게 HTML은 구조(structure) , CSS는 스타일(presentation) , JS는 상호작용 (interaction) 을 담당한다고 이해를 하였다. 구조 / 스타일 / 상호작용을 표현한다
HTML과 CSS는 웹페이지를 만드는 기초인데 먼저 배웠던 JS가 웹페이지를 컨트롤 하는 방법으로 query-selector 파일을 git에서 전부 다운로드를 받고, index.js파일을 수정한 후 HTML파일을 열어서 test통과가 되었는지 여부가 확인이 되면 commit 하고 pull request를 하였다. 이 과정을 통해서 JS가 웹페이지 안에서 활용되는 기능을 만들어 상호작용 할 수 있게 해주는 언어 , CSS는 디테일한 디자인을 담당하는 언어 그리고 HTML은 전체적인 구조를 담당하는 마크업 언어로 이해했다.
그리고 이렇게 파트별로 관심사를 분리하기 위하여 구조, 스타일, 상호작용에 대해서 나누어 코드를 작성하는 것이고 , 기획자, 디자이너, 개발자가 협업을 통해 서로의 관심사에 집중하여 멋진 웹앱을 만들 수 있는 것이라고 배웠다.
- pair-Calculator
처음에 만났었던 페어님이랑은 코플릿을 반복문까지 풀고 이번엔 계산기를 디자인하고 구현하는 페어프로그래밍을 진행했다. git에서 파일을 다운로드해서 vscode로 index.js파일안에서 필요한 기능들을 구현하기 위하여 코딩을 하고, yourStyle.css파일에 들어가서 계산기 디자인을 수정하고 html파일에서 연결되어있는 css파일을 example.css로 변경해보기도하고 , 코딩을 하다가 테스트해보려고 js 파일을 변경 해보기도 했다. specRunner.html파일과 calculator.html을 같이 liveserver로 열어서 코딩을 하고 난 직 후 결과값을 바로 확인 하면서 진행했었다.
입력값이 n1 : '2', operator : '+', n2 : '3' 인 경우, 5가 리턴되야하는 코드를 처음으로 작성 해야 했었다.
if문으로 작성을 잘 하였지만 , result = Number(n1) * Number(n2)에서 Number를 빼 먹었다.
웹 상에서 어떠한 값을 입력받을때는 모두 string으로 입력받는다고 기억한다. number type으로 입력받게 되면 오류가 생긴다고 했다.
그래도 sprint review에서 내가 페어님이랑 작성한 코드가 거의 비슷해서 기분이 좋기도 했다.
문제는 const로 변수를 선언한(?)것을 배운 기억이 없는데 어떻게 사용해야 할지 막막해서 삽질을 했었다. 나는 스트링으로 입력을 받아서 넘버로 출력을 한 것 , Console.log 보고 const 변수를 가져와서 코드를 짜는 것까지만 이해를 했었다.
DOM요소로 접근하려고 하는 것이라도 알게 되긴 했지만 25일,26일에 배열과 객체 , 28일에는 스코프 글고 6월1일에 DOM이해하기 챕터에서 배우면 다시 글을 쓰면서 이때 썼던 내용들을 떠올릴 수 있을 것 같다.
내가 이해가 되지 않았던 부분은 이벤트 위임 이라는 패턴을 이용해서 이벤트를 달고 클릭을 하면 함수가 실행이 되는 구조이고 , target이란걸 보면 내가 누른 Element의 정보를 볼 수 있는데 , 이미 만들어져 있던 버튼들에는 모두 각각 다른 class가 달려 있던 상황이었다. 그 class 들의 문자열을 비교해서 어떤 버튼을 눌렀는지 조건처리해서 로직을 구현하는 방식이었다.
빨리 언어의 개념을 배우고 그 개념에서 파생된 용어들을 응용해서 이해한 후에 높은 효율로 공부하는 날이 왔으면 좋겠다.
- 조건문 코플릿 13번 문제를 풀면서..
'-' 를 붙일 때 조건= 최고 점수보다 7점 이하인 경우였는데 , score를 10으로 나눈 나머지 값이 왜 2보다 큰건지 이해가 가질 않는다.
reference 코드를 봐도 이해가 가질 않아서 빨리 아고라 스테이츠에 질문을 해야한다.
- Linux에 대하여 공부를 하고 실습을 하였다.
먼저 기본적인 명령어에 대하여 공부를 하면서 전에 터미널 에서 썼던 몇가지 명령어들이 보여서 그나마 익숙했었다.
내가 아직 이해하지 못한 부분이 있다.
1.루트 디렉토리 (/) 와 홈 디렉토리를 구분하는 것을 정확하게 모른다
2.절대경로와 상대경로의 차이점을 정확하게 모른다
3.텍스트 에디터 nano를 실행할 수는 있지만 , 파일을 저장할 수 없다
4.운영체제에 맞는 패키지 매니저를 이용해 패키지 업데이트 , 업그레이드, 리스트 확인, 설치, 삭제 하는 것이 아직 어색하다
5.nvm 과 npm의 차이점을 정확하게 모른다
node package manager 말 그대로 node로 패키지를 관리하는 프로그램인데 npm install 패키지명 이런식으로 패키지들을 아주 간단하게 다운로드 하고 업데이트 할 수 있다고 한다. 그러면 그런것들이 package.json이라는 파일에 정보가 담겨서 그것을 가지고 협업을 하기 수월해지는 것이다.
6.package.json 에서 , script , dependency , devDependencies 가 정확히 무엇을 뜻하는 지 이해를 하지 못했다
내가 이해한 부분도 있다
1. git의 환경 설정을 할 수 있다
2.버전관리시스템의 필요성을 이해했다
3.github과 git의 관계에 대해 이해는 하였다
4.repository에 대해 이해했고 , local repository와 remote repository 둘의 차이를 이해하였다
5. 만약 어떤 프로젝트에 contributor가 되고 싶을 때 하는 과정들에 대해서 이해를 하였다
Fork >> Clone >> Status >> add >> commit >> staging area >> git의 세가지 영역 및 상태 >> Reset >> Push >> Log 순서대로 공부하였다.
- nvm 설치를 하다가 오류를 접했다.
brew를 통해서 chapter를 따라가면서 모든 설치를 끝 마쳤지만 , nvm version이 나오지 않는 상황이 발생했다..내 상황에 대한 설명과 캡처를 아고라 스테이츠에 올리고 혼자 해결을 하다가 크루님께서 디스코드로 연락이 오셨고 알려주실게 많으시다면서 줌에서 많은 이야기들과 피드백을 주셨다. 이 시간동안 package.json이 있는 파일에서 npm 을 실행해야한다는 걸 이해할 수 있는 귀한 시간이었다.이렇게 이미 설치는 되어있다고 떠 있는데 , 터미널을 다시 켜보기도하고 재부팅도 시도했지만 오류가 사라지지 않았다. 그런데 환경 변수에 들어가서 확인해보니 구글링에서 && \ . 사이에 \가 빠져있어서 그걸 지우고 :wq로 나왔더니
이런 글이 나와서 해석해보고 실수로 y를 ㅛ로 눌러서 무시하고 진행이 되었는데 , 신기하게 이후부터는 version도 나오고 vscode 터미널에서 이전에 진행했었던 query-selector와 calculaotor도 제출을 끝 마칠 수 있게 되었다. 크루님께서도 이 부분에 대해서는 확실히 모르시겠다며 구글링을 더 해보시겠다 그리고 이 오류에 대해서 y나 n을 함부로 누르지 않는게 좋을 것 같다고 하셨고 나는 오히려 새로운 터미널을 켤때마다 $ vi ~/.bash_profile >> :wq엔터 >> source ~/.bash_profile >> 아무 키 이렇게 환경변수로 들어갔다 나오는게 번거롭게 느껴지지 않고 재밌었다. 그래서 지금도 그렇게 하고 있긴하다. 페어님은 윈도우 환경으로 이 과정을 배우고 계셨는데 우분투에서 에러가 발생해서 나랑 함께 진행을 하지 못해서 아쉬웠지만 도중에 줌으로 무슨 상황을 겪고있는지 공유해주시고 나도 진행된 상황에 대해 말씀드리고 오류에 대한 개인적인 의견도 제시해드렸다.
6.짝수 생성기
위에서 적었듯이 이번 페어프로그래밍을 할 때는 페어님과 함께 짝수생성기에 대한 이야기를 많이 못 나눠서 혼자 고민하고 진행했다. 나는 코딩을 하는게아니라 range 모듈을 쓰라는 것 인지.. npm오류를 해결하고 npm install , npm install range도 진행을 하고 package.json 내용을 보면 test, start, submit 명령어를 만들어서 제출하는 건 이해가 되었는데 js파일을 어떻게 코딩을 해야할지.. 수도코드 작성부터 어떻게 해야할 지 감이 잡히질 않았다. https://heropy.blog/2018/02/18/node-js-npm/
이 글을 보면서 npm에 대해서 읽어 보았다.
그래도 해결을 하지는 못하고 ,, 금요일 sprint review 시간 이후에 올라온 reference 링크를 보고 제출하게 되었다. 근데 start에 index.js라고만 입력했었는데 , 터미널에서 파일을 실행하려면 node 파일명 (js는 생략가능) 이렇게 적어야 하니까 node index.js로 적어야 했다.
range함수에 대한 이해는 아직도 되지 않아서
https://withcoding.com/79 파이썬 range함수에 대한 글을 읽어봐야한다.
function getListMultiplesOfTwo(upTo) { const array = [];
for(let i = 2; i < upTo + 1; i += 2) {
array.push(i);
}
return array;
}
module.exports = getListMultiplesOfTwo;
친구의 도움을 받아서 range함수의 코드를 js의 for문으로 풀어보면 이렇게 나온다고 알게 되었다. 아직 공부할 것이 너무 많은 걸 느꼈다..
- 해야할 일
Markdown Preview Enhanced 라고 vscode extention에 쳐보면 마크다운 파일 작업할때 말 그대로 Preview를 볼 수 있는데 마크업이랑은 비슷한듯 (마크업은 개발용이지만 마크다운은 진짜 문서작성용이라서) 다르다고 한다. 하지만 근데 개발자들이 쓰는 플랫폼에서는 이식성이 매우 좋다고 한다.
그리고 https://www.youtube.com/watch?v=kjSZ7JKVdbQ 도 봐야한다.
- 마지막으로 course reflection ..
course reflection시간을 통해서 2주동안 배운것들 Javascript , HTML , CSS , Linux , Git 등에 대해서 다시 돌아보는 시간을 가졌고 65개의 코플릿 + 3/27 페어프로그래밍 + 매일 3시간정도의 자습시간 을 가졌다고 알게 되었다. 이렇게 2주가 지났고 3주가 남았다. section1의 중반.. 6월10일에 있는 HA시험 통과를 위해서 다음주도 열심히 공부할 것이다. 남은 3주간 어떤 것을 공부해야 할지 모르겠다면 , achievement goals를 따라해보고 꾸준히 기록하고 적극적으로 질문해야겠다.
