괴발개발

node.js, express, ejs를 이용해서 게시판 만들기(DB 없이) localhost:4000/board => 게시글 목록 보기 게시글 수정, 삭제 버튼 만들기 삭제 버튼 클릭 => 게시글 삭제 수정 버튼 클릭 => 수정 모드로 이동 => 저장 버튼 클릭하면 수정 내용 반영하기 📌 코드: https://github.com/ebulsok/KDT-hw-913.git 📌 결과물: 게시글 작성 게시글 수정 게시글 삭제

Users 서비스처럼 Posts 서비스 만들기 데이터: title, content 글 전체 조회: GET localhost:4000/posts 글 추가: POST localhost:4000/posts 📌 코드: https://github.com/ebulsok/KDT-hw-906.git

영상 랜딩 페이지 구현하기(+ 반응형) 📌 코드: https://github.com/ebulsok/KDT-hw-726.git 📌 결과물: https://kdt-hw-726.netlify.app/ 영화 을 보고 만든 페이지이다. 수업에서 배운 버거메뉴는 작은 박스 형태였지만 페이지와 좀 더 어울리도록 화면 반절을 차지하게 만들었다.

프로그래머스 코딩테스트 연습 1. 핸드폰 번호 가리기 https://school.programmers.co.kr/learn/courses/30/lessons/12948 function solution(phone_number) { var answer = ''; [...phone_number].forEach((num, index) => { if(index < phone_number.length - 4) answer += "*"; else answer += num; }); return answer; } 2. 자릿수 더하기 https://school.programmers.co.kr/learn/courses/30/lessons/12931 function solution(n) { var answer = 0; [....

주어진 HTML 문서에 다음 기능 js로 추가하기 1. 해당 날짜를 누르면 날짜가 날짜 입력 창에 자동으로 입력 2. 내용을 입력하고 작성 버튼을 누르면 해당 날짜에 작성 내용이 div 요소로 추가 3. 작성 내용을 클릭하면 삭제 코드: https://github.com/ebulsok/KDT-hw-719.git GitHub - ebulsok/KDT-hw-719 Contribute to ebulsok/KDT-hw-719 development by creating an account on GitHub. github.com 나는 3번 기능을 onclick에 deleteContent 함수를 넣어서 구현했는데 강사님은 1번 기능에서 사용한 addEventListener 함수에 3번 기능을 추가하셨다고 했다. 깃허..

https://www.youtube.com/watch?v=2FD4mW6xCJM 보고 Todo list 구현하기 날짜, 추가, 체크박스 체크 시 줄 긋는 기능 정도만 구현했다. 나중에 서버 배우면 연결하고 삭제 기능까지 추가하면 될 것 같다. 결과물: https://kdt-hw-717.netlify.app/ Todo List kdt-hw-717.netlify.app 코드: https://github.com/ebulsok/KDT-hw-717.git GitHub - ebulsok/KDT-hw-717 Contribute to ebulsok/KDT-hw-717 development by creating an account on GitHub. github.com 이렇게 주제만 주어진 자유과제가 나오면 어떤 기능을 ..

7/5 엘리스 코딩 홈페이지(https://elice.io/) 헤더 구현하기 - 드롭다운 메뉴에 있는 ^: 가상요소 선택자(::after)를 사용해서 more.png를 추가했고, hover 시에 less.png로 바뀜 - 메뉴: 스타벅스 클론코딩 할 때는 list로 짰지만, 굳이 그래야 하나 싶어 이번에는 div로 짜봤다.- - 이때의 코드는 깃허브 history 중 2번째에 있다. 7/7 엘리스 코딩 홈페이지(https://elice.io/) 헤더 드롭다운까지 구현하기 - 드롭다운 메뉴에 있는 ^: after를 사용하지 않고 두 메뉴에만 아이콘(span)을 추가했고, transform(rotate)을 걸어주었다. - 메뉴: div 대신 li를 쓰는 이유를 검색했다. '목록'임을 사용자, 컴퓨터(크롤링,..

리그오브레전드 캐릭터 선택창 구현하기 결과물: https://kdt-hw-626.netlify.app/ Document kdt-hw-626.netlify.app 코드: https://github.com/ebulsok/KDT-hw-626.git GitHub - ebulsok/KDT-hw-626 Contribute to ebulsok/KDT-hw-626 development by creating an account on GitHub. github.com

페이지(https://sparkly-cendol-b0a4f7.netlify.app/) 따라 만들기 https://github.com/ebulsok/KDT-hw-623.git GitHub - ebulsok/KDT-hw-623 Contribute to ebulsok/KDT-hw-623 development by creating an account on GitHub. github.com 색깔 어떻게 할지 고민하다가 컬러팔레트 참고..🙂 https://colorhunt.co/ Color Palettes for Designers and Artists - Color Hunt Discover the newest hand-picked color palettes of Color Hunt. Get color inspira..

div, span 요소 및 CSS를 활용하여 아래 이미지처럼 달력 만들기 https://github.com/ebulsok/KDT-hw-621.git GitHub - ebulsok/KDT-hw-621 Contribute to ebulsok/KDT-hw-621 development by creating an account on GitHub. github.com 첫 주의 월화수목을 그냥 빈 컨텐츠로 두면 div요소들이 어긋나길래 임의로 0을 넣고, 글자색을 흰색으로 설정해서 어찌저찌 만들었다. 다른 분들도 같은 고민을 많이들 하셨는지 수요일에 교육받으러 갔을 때 강사님이 두가지 방법을 알려주셨다. 1. span 태그에 vertical-align: bottom; 라는 속성을 추가한다. - vertical-ali..