Today I Learned

• 오늘 한 일

  • Naver Maps API를 이용한 맛집 리뷰 어플리케이션

  : Naver가 제공하는 Naver Maps API를 이용해 웹에 지도를 띄우고, 다음 우편번호 서비스로 주소를 입력받아 해당 주소의 좌표에 마커를 찍는다.

  : 마커를 클릭했을 때 리뷰가 없다면 리뷰를 등록하고, 이미 리뷰가 등록됐다면 등록된 리뷰를 infoWindow로 보여준다.

  : 어려웠던 점! for문 내에서 marker객체와 infoWindow 객체를 각각 만들어 addEvent를 해주면 scope 문제로 마지막 이벤트 리스너만 살아남게 된다. 정확한 내용은 공부를 더 해야 알겠지만 우선 forEach문으로 해결했다.

  • 참고한 페이지에서는 let으로 선언(block-scoping)해도 된다고 한다.

  • 어제 배운 git fork & merge를 이용해 팀원들과 협업을 했다.

  • 패스트캠퍼스 수료생 선배들과 티타임을 가지며 개발자가 되기 위한 과정에 대해서 들었다. 꾸준히 열심히 하고 모르는 것을 넘어가지 않는 게 중요한 것 같다.

맛집 리뷰페이지 ▶ 🍩 Yummy 🍩

Today I Learned

• 오늘 한 일

  • HTML, CSS, JS의 전체적인 개념을 복습했다.

  • git 으로 협업하기를 배웠다.

  • git flow를 이용해 branch를 만들고 작업, merge를 쉽게 하는 방법에 대해서도 공부했다.

  • Fork & Merge를 이용해서 여러명과 협업하고 repo에 contribute하는 방법을 새로 알았다.

• 느낀 점

  • 몸이 안 좋아 알고리즘 문제 하나를 다 풀지 못했다. 하루종일 집중력 저하로 충전의 필요성을 느꼈다.

  • git은 여러명과 프로젝트를 진행하며 불편했던 점들을 한 번에 해소해주는 느낌이었다. 더이상 카카오톡이나 텍스트파일로 코드를 주고받고 일일히 합치지 않아도 된다는 점이 굉장히 매력적으로 다가왔다. 자주 이용해 손에 익도록 만들어야겠다.

Today I Learned

• 오늘 한 일

  • LeetCode Easy 문제 : 🌟 13. Roman to Integer

  if로 I, X, C일 때 경우를 나누어 풀었다. 시간이 짧게 걸린 알고리즘들은 let, const를 썼는데 나는 아직 var로 선언하는 방법밖에 공부하지 않아 더 공부를 해야겠다.

  • webStorage 공부

  localStorage, sessionStorage의 차이와 활용방법에 대해서 배웠다.

  localStorage.setItem(storage_key, storage_value), localStorage.getItem(storage_key) 를 사용하여 localHost에서 사용자가 입력한 정보를 유지하는 기능을 다수 추가했다.

  • To do List, Signup Page 보완

  locaStorage를 이용해 기존에 만들었던 html에 유지기능을 추가했다.

  • Select, Input: radio 등 다양한 input type 학습

  단순히 text type의 input뿐만이 아니라 select.val, option.text 등을 다루는 방법을 공부했다.

• 느낀 점

  • localStorage를 이용하는 것 뿐인데 해야할 일이 대폭 많아졌다. 꼼꼼하게 정리해놓고 해당 기능을 사용할 때마다 참고해야겠다.

  ---

  • Upgrade ver. To do List ▶ 🌟

  • Upgrade ver. Sign Up Page ▶ 🌟

Today I Learned

• 오전

  • LeetCode Easy 문제 : 🌈 9. Palindrome Number

    이번 문제는 비교적 쉽게 풀렸다. 주말에 Reverse Integer와 Reverse Bit 문제를 풀었을 때 썼던 알고리즘을 응용하니 문제가 풀렸다.

• CSS로 3가지 형태의 메뉴 만들기

  BootStrap을 이용하지 않고 CSS와 jQuery를 이용해서 다운드롭, 햄버거 메뉴를 만들었다.

  jQueryUI의 slide()를 이용해서 왼 쪽에서 나오는 햄버거 메뉴를, CSS의 hover를 이용해 전체 드롭다운 메뉴와 특정 메뉴의 하단메뉴만 드롭다운으로 보여주는 메뉴를 만들었다.

• 오후

  • 다음 우편번호 서비스를 이용해 회원가입 홈페이지 만들기

    다음 우편번호 API를 이용해 우편번호를 찾고, 사용자 입력을 받아 정규표현식으로 Validation 하는 것까지 진행했다.

• 느낀 점

  • JavaScript로 처음 알고리즘 문제를 풀 때는 한 줄 치기도 어려웠는데 며칠 문제를 풀다보니까 조금씩 익숙해지는 것 같다.

  • HTML 레이아웃을 짤 때 <div>에 의존하지 않고 <ul>과 <li> 태그를 자주 이용해야겠다는 생각을 했다. 매번 잊어버리므로 유념하자.

🌈 Simple Sign Up Page git address ▶ [Simple Sign Up Page] ◀

Today I Learned

어제는 처음으로 토익을 보러 갔다. 피곤해서 컴퓨터를 켜지도 못했지만 앞으로 알고리즘 문제를 하나라도 풀어야겠다.

• 오전

  • LeetCode Easy 문제: 7. Reverse Integer 와 관련문제 190. Reverse Bits를 풀었다.

• 오후

  • Hexo blog의 이름을 바꾸고 전부터 적용하고 싶었던 Hexo Clexy 테마를 적용했다. 처음에는 어떻게 해야할 지 몰랐지만 Clexy github description을 보며 따라하니 어떻게 적용이 됐다.
    내 마음대로 디자인을 바꾸려면 공부를 더 해야겠다.

• 카테고리를 나눠서 알고리즘 풀이, HTML/CSS와 javaScript 등 공부한 내용을 정리해서 올리고 싶어서 카테고리를 추가하는 방법을 찾아봤는데 잘 알 수 없었다. 강사님께 물어봐야겠다.

Today I Learned

• 오늘 한 일

  • LeetCode Medium 문제를 풀었다. C나 C++이 아니고 익숙하지 않은 JavaScript로 알고리즘 문제를 풀려니 메소드를 하나하나 찾아야해서 시간이 오래 걸렸다.

  🐸 2. Add Two Numbers

  : if문을 잔뜩 사용한 내 코드와 달리 carry를 이용한 솔루션을 보고 알고리즘 공부를 꾸준히 해서 효율성을 높여야겠다는 목표가 생겼다. 적어도 하루에 하나씩은 LeetCode 문제를 풀려고 한다.

  • 오후엔 JavaScript를 이용해 Lotto 추첨기를 만들었다.

• 느낀 점:

  사용자의 입력을 받아서 화면에 적절히 출력하는 게 아직 어렵다.

  3명이 팀별로 진행하다보니 알고리즘을 짜는 데에도 토의를 하느라 시간이 길어졌다. 협엽과 HTML, CSS, JS를 다루는 법에 조금 더 익숙해져야겠다.

🐸 Lottery Machine git address
LOTTERY Machine

Today I Learned

• JavaScript Method

  window 객체의 method를 통해 사용자 입력, 화면 제어, 스크롤 제어 등을 하는 방법을 새로 배웠다.

  외에도 screen, history, navigator, location 객체의 method를 활용해 사용자 분석을 위한 정보를 parsing하는 걸 프론트엔드에서 할 수 있다는 것을 알았다.

• Interval & Timer

  네트워크 프로그래밍 수업 때 잠시 배웠던 Push, Polling 기법과 timeout을 간략하게 들었다.

  시간이 날 때 개념을 확실히 하기 위해 노트에 적어두었다.

• jQuery

  jQuery의 selector를 이용, 요소의 이벤트를 처리하고 속성값을 이용해 기능을 구현했다.

• TO DO LIST

  과제로 TO DO LIST를 만들었다.

  느낀 점:
  할 일을 추가, 수정, 삭제, field를 나눠서 보여주는 것만 하면 되는데도 생각해야할 것들이 많았다.

  사용자가 작은 기능이라도 편하게 이용할 수 있도록 프로그래밍하는 것이 하나도 쉬운 게 없다.

💘 My To do list git 주소
To Do List

Today I Learned

오늘부터 하루하루 내가 배우고 공부한 것들을 정리해놓기로 한다.

• 오전 - 팀 토의

  일주일이 조금 넘게 웹 기초를 배우며 과제를 진행한 것에 대해서 팀원들과 토의를 나눴다.

  나는 Grab 홈페이지에서 설명을 누르면 이미지가 바꾸도록 jQuery를 써보는 과제가 인상 깊었다.

  Responsible Web 과 SEO 등 집중해서 공부하고 싶은 것들이 생겼다.

• 오후 - git

  1. git으로 블로그 만들기 : HEXO

  Lorem ipsum 등 dummy text를 넣어 html 디자인 전 레이아웃을 잡는 방법을 알았다.

  github에서 제공하는 github.io Blog를 만들었다. Hexo를 설치하고 포스팅하는 방법을 알았다.

  : hexo new post, hexo generate, _config.yml을 수정한 후 hexo deploy

  : deployment - the use of something or someone in an effective way

2. git branch & checkout & merge

협업을 위해 중요한 git의 branch와 commit 개념을 배웠다. 익숙해지면 버전관리와 개발에 많은 도움이 될 것 같다.

난 Markdown Emoji가 좋다 🐷
Markdown Emoji