frontend
-
[Assignment] 위스타그램 코딩 Chapter 2. main pageDevelope/Assignment 2020. 5. 2. 15:32
1. 시작 ◎ 위스타그램 login page를 마무리하고 main page 작업을 시작하였다. repl.it 에 있는 위스타그램 메인 페이지를 구현을 하였다. 2. 가이드 ◎ html, css header는 scroll 되어도 최상단에 fiexd 되어야 한다. hedaer와 main은 화면의 중앙에 위치하여야 한다. main을 두 개로 나누어 좌측에는 피드, 우측에는 스토리 및 팔로우 추천이 있다. 우측 정보들은 scroll 되어도 fiexd 되어야 한다. 피드는 하나만 만들어도 된다. ◎ javascript 댓글 input 창에 엔터 치거나 "게시"를 누르면 댓글이 추가되어야 한다. createElement로 요소를 생성해서, input에 입력한 값이 추가되어야 한다. 3. 레이아웃 ◎ 위스타그램 메인..
-
[Assignment] 위스타그램 코딩 Chapter 1. login pageDevelope/Assignment 2020. 5. 1. 11:20
1. 시작 ◎ 위코드에서 프론트엔드 개발자를 희망하는 사람들은 HTML, CSS, Javascript repl.it 과제가 끝나면 인스타그램 클론 코딩 과제가 있다. 바로 "위스타 그램"이다. repl.it 에 있는 위스타그램 로그인 페이지를 먼저 구현을 하였다. 2. 가이드 ◎ html, css 로그인 전체를 감싸고 border가 적용된 div 태그가 필요하다. input tag 사용 (type은 text 또는 password, placeholder는 속성을 사용하여 "전화번호, 사용자 이름 또는 이메일" 등의 값을 넣어주면 된다.) button 태그를 사용 ◎ javascript id, pw에 각각 한 글자 이상 써야 버튼이 활성화되도록 해야 한다.(연한 파란색 -> 활성화되면 파란색으로!) 3. 레..