컴공과 컴맹숙 🐾

| 좋았던 점 HTML/CSS 미션이 끝난 후 걱정이 정말 앞섰던 점이 자바스크립트로 동적인 뭔가를 만들어 본 경험이 없고, 문법만 몇 줄씩 코딩해 본 것이 끝이라 '수박 겉핥기 식으로 알고 있는 자바스크립트로 JS 미션을 해낼 수 있을까' 였습니다. (아마 겉핥기 수준보다 더 낮았을지도 모르겠습니다.) 이전 미션 때와 같이 두려움이 컸고 기간 내에 제출이나 할 수 있는지 조차 확신이 서지 않았습니다. Todo 리스트에 적힌 미션을 완성할 수 있는 날은 6일 가량의 시간이 주어졌지만, 이전 미션 때와 마찬가지로 조금 더 일찍, 2월 말부터 미션을 시작했습니다. 그리고 매일매일 조금씩이라도 수정하고 건드려보면서 하나씩 완성을 해나갔습니다. 미션 1번은 하루만에 미션을 완료해서 난이도가 비교적 쉽게 느껴졌고..

| 3개월 차 좋았던 점 벌써 교육과정 3개월이 지나면서 자바스크립트 과정까지 끝났습니다. 자바스크립트 공부를 하면서 새로 알게 된 자바스크립트 내장 함수의 메소드가 많았습니다. 혼자서 실습 해보면서 메소드의 용도나 활용법에 대해 확실히 알게 되었습니다. 또 그러면서 프로젝트를 진행하거나 코딩테스트를 볼 때에도 도움이 많이 되었던 것 같습니다. | 2개월 차에 수정한 학습 계획대로 공부하고 있는가? 2개월 차의 학습 계획은 코딩테스트 0단계 매일 3문제씩 풀이하기, 2월 말부터 JS 프로젝트 틈틈이 완성하기였습니다. JS 프로젝트는 계획대로 2월 말부터 조금씩 완성을 했습니다. HTML/CSS 프로젝트에 비해 투자해야 하는 시간이 훨씬 더 많기는 했지만 그래도 미리 시작한 덕분에 마감기한에 맞춰 완성하여..

| JavaScript를 공부하면서 느낀 점 확실히 HTML/CSS 공부를 하던 때보다 어려움이 두 배, 세 배 더 많았던 것 같습니다. 처음 알게 된 개념들도 너무 많았고 학습해야 하는 범위가 방대했기 때문에 제 스스로는 6주의 시간 동안 자바스크립트를 완벽히 마스터했다고 말할 수는 없을 것 같습니다. 개념이 완벽하게 숙지되지 않은 상태에서 바로 동적 페이지를 구현하는 실습을 진행하게 되었을 때 강의를 따라가기 버거웠습니다. 하지만 하나를 이해하자고 뒤에 산더미처럼 쌓여있는 강의를 밀릴 수 없었기에 우선은 그날그날 강의를 수강하며 남는 시간에 팀원들에게 질문하고 구글링을 하며 부족한 부분에 대해 학습을 했습니다. 그럼에도 자바스크립트의 벽은 높고 전문성을 갖추기 위해서는 상상 이상의 시간투자가 필요하다..

프로토타입 어떤 객체가 만들어지기 위해 객체의 모태가 되는 원형 자바스크립트의 모든 객체는 프로토타입이라는 객체 보유 모든 객체는 그 프로토타입으로부터 프로퍼티와 메소드를 상속 ∴ 자바스크립트의 모든 객체는 최소한 하나 이상의 다른 객체로부터 상속, 이 때 상속되는 정보를 제공하는 객체가 프로토타입 프로토타입 생성 객체 생성자 함수를 작성하여 생성 생성자 함수를 작성하고 new 키워드를 통해 객체 생성 -> 같은 프로토타입을 가지는 객체들 생성 function Dog(color, name, age) { this.color = color; this.name = name; this.age = age; } let myDog = new Dog("흰색", "흰둥이", 2); // myDog 객체는 Dog라는 프로..

시맨틱 태그란? Semantic은 '의미의, 의미론적인'이라는 뜻으로 시맨틱 태그는 '의미를 부여한 태그' 라는 뜻이고 HTML5부터 등장했다. 시맨틱 태그의 종류로는 header 웹 페이지의 머리 영역 section 제목별로 나눌 수 있는 문서의 콘텐츠 영역 article 개별 콘텐츠 영역 aside 좌측, 우측 사이드 영역 footer 웹 페이지의 바닥 영역 nav 웹 페이지의 메뉴 영역 많이 쓰이는 태그는 이렇게 약 6가지 정도인 것 같다. 태그의 이름만 봐도 어떤 영역에 쓰이는 태그인지 알 수 있다. 시맨틱 태그를 사용하는 이유 영역마다 무슨 태그를 써야하는지 구분하는 것이 귀찮고 번거롭기 때문에 그냥 div 태그를 때려 박아서 웹 페이지를 만들 수 있기는 하다. 하지만 시맨틱 태그를 사용했을 때..

| 이론부터 실전까지 자료구조 / 알고리즘 고차함수 하나 이상의 함수를 매개변수로 취하거나 함수를 결과로 반환하는 함수 고차함수 관련 배열 조작 메소드 ① Array.sort() : 배열의 요소를 정렬하여 반환 문제점 - sort()로 정렬될 때 배열 요소가 일시적으로 문자열로 변경 (유니코드 순서에 따라 정렬됨) ==> sort()의 파라미터로 함수 정의 array.sort(function(a, b) { // 오름차순 return a - b; }); array.sort(function(a, b) { // 내림차순 return b - a; } ② Array.forEach() : 배열 요소 별 콜백 함수를 각각에 실행 let nums = [1, 2, 3]; nums.forEach(function (i) {..

| 이론부터 실전까지 자료구조 / 알고리즘 재귀함수 : 함수 스스로 자신을 참조해 호출하면서 동일한 코드가 계속적으로 수행되는 호출 방법 특정 조건이 됐을 때 자신을 그만 호출하도록 제한하는 exit code가 필요 function recursive(num) { if(num == 0) return; // exit code recursive(num - 1); } recursive(3); // 함수 호출 콜백함수 : 다른 함수의 매개변수로 전달되는 함수 const message = function() { console.log("This is a message"); } setTimeout(message, 3000); // 3초 후 message함수 호출 자바스크립트는 순차적으로 실행되지 않는 비동기 프로그래밍..

| Computer Science 이론 쿠키 & 세션이란? : 웹 통신간 유지하려는 정보(로그인 정보)를 저장하기 위해 사용되는 파일 HTTP는 통신이 끝나면 상태를 유지하지 않는 것을 보완하기 위한 기법 - HTTP의 특징 Connectionless : 클라이언트가 서버에 요청하고 서버가 응답을 보낸 후 연결을 끊는 방식 Stateless : 클라이언트와 서버가 첫번째 통신에서 데이터를 주고 받아도 두번째 통신에서 이전 데이터를 유지하지 않음 ==> 쿠키 & 세션 : 서버에게 클라이언트가 누구인지 통신할 때마다 인증해야 하는 번거로움을 해결한 방법 (HTTP의 Stateless를 보완) 쿠키 & 세션의 차이 쿠키 세션 저장 위치 클라이언트 서버 저장 형식 텍스트 객체 만료 시점 브라우저 종료해도 만료시..

| Computer Science 이론 리눅스 쉘 리다이렉션 (Redirection) : 명령의 출력 변경이 가능 명령어의 결과는 표준 출력 방식인 모니터에 출력 리다이렉션 👉 표준 입출력 흐름 변경 & 파일에 기록 가능 > : 기존 파일 내용 삭제, 새로운 결과 저장 ex) ls > test.txt ls로 출력되는 표준 출력 방향을 test.txt.로 바꿈, test.txt에 ls 출력 결과 저장 > 또는 > test.txt 기존 test.txt 파일에 ls 출력 결과 추가 파이프 : 두 프로세스 사이에서 한 프로세스의 출력 스트림을 다른 프로세스 입력 스트림으로 사용 (=> ..

| 좋았던 점 HTML과 CSS를 대학생 때 처음 접했는데 그 때부터 무언가 제대로 된 프로젝트를 해본 적이 없었습니다. 제로베이스를 통해 제대로 된 프로젝트를 처음으로 만들어볼 기회가 생겼습니다. 프로젝트를 시작하기 전에 '내가 이걸 만들 수 있을까' 하는 생각에 걱정과 두려움이 컸습니다. 처음으로 프로젝트를 해보는 것 뿐만 아니라 기간 내에 끝낼 수 있을지도 확신이 가지 않았습니다. 그래서 제가 선택한 방법은 매일매일 조금씩 완성하자 였습니다. Todo리스트에는 약 6일동안 할 수 있는 시간이 주어졌지만 나는 6일동안 이거 절대 못 끝낸다... 하면서 1월 초부터 매일 조금씩 완성을 했습니다. 그렇게 매일 프로젝트를 완성하다 보니 스스로도 실력이 성장하는 것을 느꼈습니다. 그리고 막혔던 부분들을 해결..