코딩공부
-
성인 교육시장빈짱의 일상글 2020. 8. 21. 23:57
#성인 교육시장 세상이 난리다. "취직해서, 회사에 충성하며 연봉을 올리고 사회적 지위를 높여가면 그 끝에는 내 집 마련과 안정된 노후가 준비되어 있을 것이다."라고 속삭였던 국가 시스템이 개인을 배신했다고들 난리다. 아니, 개인들이 속고 살아온 것일지도 모른다. 이런 불신 풍조와 함께 제2, 제3의 수익원을 만들자고 제창하는 성인 교육시장이 성황이다. 굳이 언급할 필요도 없고, 까마득한 세월을 거슬러 올라가며 '뇌피셜'로 과거를 답습하기는 싫다. 한 가지 정확한 사실은, 삶이 변하였다는 것. 배움에는 끝이 없다는 말이 사실임을 철저히 증명이라도 하듯 최근 몇 년 동안 성인 교육 플랫폼들이 왕성하게 세를 확장하고 있다. 내가 벌써 몇 곳의 플랫폼을 통해 학습을 하고 있을 정도이니 변화는 정말 곁에 와 닿..
-
데이터 사이언스?캡틴 코딩일기 2020. 8. 19. 23:23
#데이터사이언스 작년 말, 한껏 부푼 마음으로 약 4개월 동안 코딩 강좌를 수강하였다. 종목은 javascript. 많이 배우고 또 좌절했던 기억으로 남아있는 코딩 수업은 현실을 자각하는 계기이기도 했는데, 주된 이유는 넘기 힘든 벽.. 은 무슨 문제를 마주했을 때 깊이 고민하려는 의지가 부족했다. 아니면, 조금 더 시간을 들여서라도 폭넓게 닿지 못했던 곳까지 살펴 답을 찾으려는 노력이 부족했던 것이 원인이다. 그리고 깊은 생각에 빠질 수 있도록 나를 이끌지 못한 것은, '이걸로 뭘 더 할 수 있지?'라는 물음표에 대한 해답을 수업기간 중에 제대로 찾지 못했기 때문이기도 하다. 중간중간 동기부여를 위해 학원 측에서 준비한 다양한 포트폴리오들을 보기도 했지만, 실제 서비스화 직전인 완성품들은 오히려 내가 ..
-
TIL : 문자열 메소드 공부 (문자열 일부만 변환하여 출력하기)캡틴 코딩일기/javascript 2020. 3. 22. 23:11
TIL : 문자열 메소드 공부 (문자열 일부만 변환하여 출력하기) 문자열(배열) 메소드를 사용한 함수를 구현해보았다. ⭐️기능 1. 띄어쓰기로 구분된 문자열을 인자로 할당하면, 단어의 첫 글자를 대문재로 바꾸어준다. 2. 단어가 하나만 주어질 때에도, 여러가지 단어로 구성된 문자열이어도 처리할 수 있다. ⭐️사용한 문자열 메소드 1. split : 분리 기준이 될 문자열을 인자로 할당하여, 문자열을 분리하고 새 배열로 출력하는 메소드. 2. toUpperCase : 주어지는 문자열 전체를 대문자로 변경하여 출력하는 메소드. 3. substring / slice : 시작과 끝의 인덱스 값을 인자로 할당하여, 문자열을 잘라내어 출력하는 메소드. 4. join : 배열의 모든 요소를 연결하여 문자열로 출력하는..
-
TIL : 재귀(Recursion) 함수 / fibonacci numbers 구현캡틴 코딩일기/javascript 2020. 3. 14. 23:50
TIL : 재귀(Recursion) 함수 / fibonacci numbers 구현 오늘은 재귀 함수를 활용한 피보나치수열(fibonacci numbers) 구현을 공부하였다. 재귀 함수란, 자기 자신을 호출하는 함수를 의미한다. 함수에 숫자가 주어지면 1씩 작은 숫자를 곱하고, 마지막으로 1을 곱하여 그 결과를 반환하는 로직에 재귀 함수가 사용되는 예시를 강의에서 보게 되었다. function multiply(n){ if(n === 1){ return 1; // 1은 더이상 곱할 숫자가 없기때문에, 1을 반환 } return n*multiply(n-1); // multiply( )함수를 함수 안에서 다시 사용(= 재귀함수) } // multiply(5) -> 5*multiply(4) 5*[4*{3*(2*..
-
TIL : arguments 객체와 rest parameter(+ separate 연산자)캡틴 코딩일기 2020. 3. 12. 16:37
TIL : Arguments 객체와 rest parameter(+ separate 연산자) underbar(underscore.js) 공부는 참 어렵다. 유용하게 사용할 수 있는 도구로서의 underscore.js를 직접 만들어보는 것은 함수가 작동하는 원리를 알 수 있어서 도움이 되겠으나, 메소드를 하나하나 구현해 나가는 일이 결코 쉽지 않다. 아직 갈피를 못잡고있지만, _.extend 메소드 구현을 위해 헬프데스크를 기웃거리던 중에 'arguments객체' 와 'rest parameter' 에 대한 내용을 보게 되었다. MDN문서와 블로그 포스팅을 읽고, 같은 듯 다른 두 인자들에 대해서 아래와 같이 정리해본다. 같은 점 : 둘 다, 함수의 소괄호 안에 들어가는 매개변수와 관련된 항목이다. 1) ar..
-
Twittler(Twitter clone) 구현하기 - (5) random한 tweet 불러오기캡틴 코딩일기/javascript 2020. 3. 11. 14:00
Twittler(Twitter clone) 구현하기 - (5) random 한 tweet 불러오기 이번엔, check new tweet 버튼을 눌러서 random 한 user name - message를 불러와서, tweet창에 추가하는 함수에 대해 정리해보겠다. data.js 에 담긴 data는 user name과 message가 각각 분리된 '배열(array)'로서 저장되어있다. randomUser = []; randomMessage = []; 그리고, 내가 만든 함수는 아니지만 random한 index를 생성하는 함수가 미리 구현되어있었다. 이 포스팅을 정리하면서 처음 들여다보게 되었는데, MDN에서도 내용을 다루고 있어서 쉽게 이해가 되었다. (Math.floor / Math.random 을 검색..
-
Twittler 구현하기 - (4) HTML에 입력한 글을 javascript로 처리하기캡틴 코딩일기/javascript 2020. 3. 10. 13:00
Twittler 구현하기 - (4) HTML에 입력한 글을 javascript로 처리하기 벌써 twittler에 대한 네 번째 포스팅이라니! 이번에는 user name과 comment 아래에 만들어둔 text / textarea에 직접 입력하는 내용을 javascript 함수를 사용해서, new tweet으로서 추가하는 방법에 대해 정리하겠다. 지난 포스팅에서 다루었던 DOM관련 내용 중에, selector를 지정하는 방법은 네 가지가 있다고 언급되었다. 어떤 selector에도 사용이 용이한 'querySelector'를 사용하여 기능 구현에 대해 설명하려고 한다. 먼저, 입력 ~ 출력의 순서에 대해 정리해보았다. 1) user name과 comment 에 각각 해당하는 내용을 작성한다. 2) twee..
-
Twittler 구현하기 - (3) javascript DOM(Document Object Model)캡틴 코딩일기/javascript 2020. 3. 9. 13:00
Twittler 구현하기 - (3) javascript DOM(Document Object Model) ** 상/하단의 광고 클릭 한 번이, 꾸준한 창작활동에 큰 도움이 됩니다 :) ** 드디어, javascript를 활용하여야 하는 때가 왔다. 처음 해결해야 하는 과제들을 읽고 나서, 구현해야 하는 기능에 대해서는 알 수 있었지만 그 기능들을 어떻게 함수로 만들어야 하는지에 대해서는 갈피를 잡지 못했다. 질의응답 페이지에 가서 다른분들의 고민들을 기웃거려보기도 하고, 비슷한 고민에 머리를 부여잡고 끙끙대셨던 분들의 기록도 참고는 하였다. 하지만, 이때부터 Visual studio의 화면 가득한 코드들을 정식으로 보게 되었던 터라 다른 분들이 작성한 코드는 쉽게 눈에 들어오지 않았다. 게다가 그 구현 논..
-
Twittler(Twitter clone) 구현하기 - (2) HTML (selector 지정)캡틴 코딩일기/javascript 2020. 3. 8. 13:00
Twittler(Twitter clone) 구현하기 - (2) HTML (selector 지정) ** 상/하단의 광고 클릭 한 번이, 꾸준한 창작활동에 큰 도움이 됩니다 :) ** 개요에서는 twittler를 동적으로 구현하기 위한 javascript를 활용한 구현 목표를 집중적으로 다루었으나, 구현되는 기능들을 잘 보여줄 수 있는 HTML도 정말 중요하다. 이미, twittler mock-up을 구현해 보았기 때문에 쉽게 만들 수 있다고 생각하지만 javascript와의 조화를 생각한다면 아직도 고민해야할 부분들이 많다. (실제 그렇게 삽질을 오래도록 했었다.. ) 1) HTML 구성 HTML/CSS 로 mock-up을 구현했던 기억을 되짚어가며, 화면 구성의 뼈대가 되는 영역을 크게 4가지로 구분하였..
-
Twittler(Twitter clone) 구현하기 - (1) 개요캡틴 코딩일기/javascript 2020. 3. 7. 19:26
Twittler(Twitter clone) 구현하기 - (1) 개요 ** 상/하단의 광고 클릭 한 번이, 꾸준한 창작활동에 큰 도움이 됩니다 :) ** 과제를 완성한 지 시간은 조금 지났지만, 스스로 뿌듯했던 twittler 구현에 대해 정리해두고 싶어서 몇 개의 포스팅으로 구분하여 해결 과정을 남겨보려고 한다. 그림에 메모한 주요 구현 기능들을 다시 한번 정리해보면, (네 번째 블록) 처음 페이지를 열었을 때, database(data.js에 등록된 DATA 배열의 요소들)를 tweet 창에 렌더링 할 것. (두 번째 블록) user name과 comment란에 내용을 입력하고, Tweet! 버튼을 눌러서, tweet 창(네 번째 블록)에 위로 쌓아 올리는 tweet을 넣어준다. (세 번째 블록) ch..