Project
-
[Clone Coding] Netflix 클론 코딩 (HTML/CSS + JS) - 0. IntroProject 2021. 3. 18. 23:17
HTML과 CSS를 연습하는 좋은 방법 중에 하나가 클론 코딩을 하는 것이라는 말을 들었다. 그래서 HTML, CSS를 간단하게 훑어본 후, 본격적으로 클론 코딩으로 연습을 해보려고 한다. 여러 강의를 찾아보다 우선은 무료 강의로 해보고 싶어 Traversy Media 라는 유튜버 분의 강의를 선택했다. 웹 개발과 프로그래밍 튜토리얼에 대한 강의를 올리는 분이다. 자세한 코드는 'Build a Netflix Landing Page Clone with HTML, CSS & JS' 영상 설명란에서 볼 수 있다. 이 포스트에서는 자세한 전체 코드가 아닌, 전체적인 클론 코딩 방법과, 자세히 공부할 HTML이나 CSS 태그들에 대해 주로 설명하고자 한다. Build a Netflix Landing Page Cl..
-
[Project - 01] 2. 랜덤 좌석 배정 프로그램 : 기본 기능 만들기Project/[Project - 01]랜덤 좌석 배정 프로그램 2021. 1. 22. 17:39
랜덤 좌석 배정 프로그램의 기본 기능은, [좌석 배정] 버튼을 누르면 아래의 책상에 랜덤으로 번호가 배정되는 기능입니다. 전체 코드는 github에서 확인할 수 있습니다. https://github.com/younyikim/RandomSeat ●IDE : Atom 제목 및 table 레이아웃 랜덤 좌석 배정 프로그램 font는 구글 font를 사용하였습니다. 테이블을 책상 배치처럼 보이게 하기 위해, 아래와 같은 css 속성을 지정하여 사용하였습니다. table { width : 90%; border-spacing: 0px 10px; } th, td { border : 1px solid black; text-align : center; font-size : 20px; } Button button은 이곳(..
-
[Project - 01] 1. 랜덤 좌석 배정 프로그램 : 개요Project/[Project - 01]랜덤 좌석 배정 프로그램 2021. 1. 22. 16:28
Git에 대한 포스트들 이후로 한동안 포스트를 올리지 못했는데, 그 기간 사이에 HTML,CSS,JavaScript를 다시 한번 훑어보면서, 연습삼아 간단한 프로그램을 하나 제작해보자 해서 이 '랜덤 좌석 배정 프로그램'을 만들기로 했습니다. 처음에는 MVC구조나, model1 구조를 가지고 만들까 생각했는데, 크게 DB가 필요한 프로그램도 아니고 괜히 더 복잡해질 것 같아 HTML,CSS,JavaScript로만 우선 만들어보려고 합니다. (이후에 점차 기능을 추가해볼 예정..) "랜덤 좌석 배정 프로그램" 어떤 프로그램인지, 왜 만드려고 하는지에 대한 얘기를 잠시하고, 본격적으로 프로그램에 대해 소개를 하겠습니다. HTML,CSS,JavaScript은 단순히 개념과 실습만으로 공부하기 굉장히 재미없습니..
-
[Project - 01] 0. 랜덤 좌석 배정 프로그램 : README.mdProject/[Project - 01]랜덤 좌석 배정 프로그램 2021. 1. 22. 15:59
README.md 프로젝트 명 : 랜덤 좌석 배정 프로그램 개발 환경 ● Language : HTML , CSS, JAVASCRIPT ● OS : Windows, Mac OS ● IDE : Atom 주요 기능 ● 사용자가 인원을 선택하면 랜덤으로 좌석이 배정됨. (진행중 - 85%) ● 특정 번호가 항상 짝이 될 수 있게 조정할 수 있음. (예정) ● 사람들의 이름이 적힌 엑셀 파일을 올리면, 이를 이용하여 좌석 배정을 할 수 있음.(예정) ● 이전의 좌석 배정 내용을 확인할 수 있음.(예정) ● 이전 좌석에는 앉지 않기 / 이전 짝꿍과는 앉지 않기 (예정) 프로그램 화면 * Github : github.com/younyikim/RandomSeat