겸이네~

음.. 오랜만에 챌린지 기록을 해본다 그동안 계속 챌린지는 진행중이긴 한데 ~ 다른거 포스팅하고 공부하느라 이것 까진 못하겠다 싶었는데 오늘부터는 간단하게라도 기록해야겠다. 일단 오늘의 challenge내용은 영화정보가 담긴 fakeDB를 이용해서 간단한 웹을 제작하는 내용이다. 조건이 세가지 있는데 먼저 기본적으로 정의된 세가지 컨트롤러가 있는데 1. home should list all the movies 2. movieDetail should show a movie based on the :id 3. filterMovie should filter for a movies based on the rating or the year.~! 홈 컨트롤러는 모든 영화리스트를 보여줘야하고, 영화디테일 컨트롤러는 ..

기존 프로필 수정 페이지는 get방식만 있었다 그런데 이제 프로필 이미지 수정이나 이름 수정 , email 수정등을 추가할 예정이라 이제 post방식의 컨트롤러도 하나 만들어 준다. 수정했으니 이제 라우터도 바꿔주자 음 이제~~ 프로필 이미지 변경에 필요한 미들웨어를 하나 만들어 준다. 비디오 업로드와 동일하다~~ 인코딩 타입 정해주고~ 업로드 파일 형식 지정을 해줬다. 그리고 프로필 수정페이지에 들어가면 인풋박스에 벨류값으로 현재 로그인된 유저의 이름과 이메일을 띄워준다. 그리고 postEditProfile 컨트롤러를 만들어주자 먼저 body parser를 통해 이름과 이메일 업로드 파일을 가져오고 만약 파일이 있다면 이전에 저장소에 저장된 파일을 경로를 통해 삭제해주고 또한 함께 db의 avatarU..

이번엔 join화면을 바꾸자 . 회원가입을 하면 자동으로 로그인을 하고 홈화면으로 이동하게 한다. 먼저 userController.js로 가보자 현재는 회원가입 페이지만 뿌려줄 컨트롤러만 있다. 회원가입을 하고 이메일, 비밀번호 등등을 보내줄 post할 컨트롤러가 필요하다. 기존 join을 getJoin으로 바꿔주고 postJoin컨트롤러를 하나더 만들어주자. 서밋이 이루어지면 바디파서를 통해 이름 이메일 비밀번호 정보등을 받아오고 비밀번호와 비밀번호 확인이 제대로 체크가 안되었다면 badrequest code를 뿌려주고 다시 조인 페이지로 돌아가고 만약 제대로 정보가 입력되었다면 홈화면으로 redirect해준다. 여기서 더 구현해야 할 일은 user정보를 database에 등록하고 유저를 로그인 시키는..

이번엔 header.pug 템플릿에 검색창을 넣어보자 header.pyg에 칼럼을 하나 더만들어주고 form!태그를 써주자 ~~~ url은 routes.search페이지 이고 method는 get방식이다. 그리고 생성된 검색창(input)에 food를 검색하면 url이 이렇게 바뀐다. 이제 search페이지에 표시할 정보들이 주어졌다. search페이지를 수정하자. 검색한 검색어를 표시해주도록 해보자 검색을 하게되면 아래 searching by 검색어 가 뜨게 해주겠다. #{searchingBy}라는 변수를 설정해주고 (위사진은 오타다) videoController로 가서 설정해주자 search페이지로 랜더링하는 곳에 새로운 리턴값을 넣어주자 이제 암시적 리턴을 사용할 수 없으니 {}블럭을 이용하자. 먼..

아주 중요한 태그이다. 유저가 입력한 데이터를 수집하기 위해 사용되며 input, textarea, button, select, checkbox, radio button, submit button등의 입력 양식 태그를 포함한다. 웹페이지 만들때 꼭 들어간다? 고 봐야 한다. 서버사이드와 연결한다. 페이지에 로드될 정보라던지 유저가 요청한 데이터를 서버에서 가져오고 유저가 입력한 정보를 서버로 전송도 한다. attribute 는 action 과 method가 있는데 action은 URL을 값으로 가지며 입력 데이터 (form data)가 전송될 url을 지정한다. method는 입력데이터의 전달 방식을 지정한다 GET / POST 방식이 있다. GET get 방식은 전송 url에 데이터를 query str..

다음 강의를 넘어가기 전에 form에 대해서 더 짚고 넘어간다. flask로 페이지 제작해 볼 때 form이 거의 다였었다. form form form.. 근데 그땐 이해가 잘 안갔는데 이번에 확실히 좀 넘어가자 form 은 2가지 속성(attribute)를 가지고 있다 1. action 액션은 어떤 페이지로 폼에서 받은 데이터를 전송할 건지 지정하는 것 2. method method는 어떤 method로 전송하는지 결정하는 것이다. POST와 GET이 있다. POST는 백엔드 서버에 정보를 전송하는 방식 (지금은 백엔드는 하지 않기 때문에 사용 X) GET은 보안에 취약하여 중요한 정보를 가진 data를 보내는데 쓰면 안된다(ex-password,userInfo,...) very important!