일단 하나를 해보자

앞에 올린 글

노드js express로 로그인 창만들때 

헷갈렸던 거

app.get   app.post 차이

그니까(내가 본 설명글 / 이것도 있음)

get은 /주소 보이는 방식이라서 /뒤에 주소 써주는데로 이동하고 띄우고 get써서 경로이동할 수 있게 하고

post는 주소 안보여주는 방식. 눈에 보이지 않는 주소요청 받아처리함. post에서는 서버에서 처리할 일 요청할 수도 있고 데이터를 전송할 수도 있음

앞에 쓴 글

코드 보면

html에서

post 로 form 써서 

메인페이지랑

로그인페이지 둘다 name 데이터 전송해서 썼어

app.js 에서는 경로 이동 쉽게 할려고 get쓰고

post로 정보 받아서 썼구나

오호...

res.send 특징 

res.write 써야돼? 여러개 쓰고 싶으면?

https://fierycoding.tistory.com/18

• res.send(body), res.send(status, body) : 클라이언트에 응답을 보냄. 상태 코드는 옵션. 기본 콘텐츠 타입은 text/html이므로 text/plain을 보내려면 res.set(‘Content-Type’, ‘text/plain’)을 먼저 호출 해야한다. JSON을 보낼거면 res.json을 쓰자.

여기 req res 메서드 개념 잘 정리 되어있다!!

사실 정말 가려운 곳 못긁었는데 차차 해보면서 알아가도록 ..

키 값

name vaule 차이가 뭐야

넘길 때 왜 name 넘겨주면 value는 왜 쓰지..  

Value = The value attribute specifies the value of an element.

Name = name is only to post form data. The name definies what the name of the attribute will be as soon as the form is submitted. So if you want to read this attribute later you will find it under the "name" in the POST or GET Request. Whereas the id is used to adress a field or element in javascript or css.

 설명굿

아하!!

맞다

요거네 name이 전달되고 value는 입력 태그의 초기값

오호라 헷갈렸어

2일차 0806 수업

#form

<form action=""></form>
사용자가 입력한 정보를 서버로 전송할 때 사용한다.

로그인이나 회원가입 등 아이디랑 비번 입력하면 서버쪽에서 

가지고 DB확인. (암호화해서 보내면 서버에서 매칭해줌)

/ 는 주소 구분

입력받는 태그 <input>

#form전송

method="POST"
어떤 걸 입력했는지 제출했을때 안뜸!

method="GET"
아이디에 뭐썼고 비번에 뭐썼는지 보임

배울 때 저 

name

value

의 차이가 뭔가, ""안에 어떻게 써야하는건가 어려웠는데 

name을 내가 임의로 짓는 이름

value가 서버로 전달되는 정보값인가? 로 일단 이해함

!

파일명, 폴더명의 중요성 어필

네이밍 중요하다

누가봐도 알 수 있게 이름지을 때 풀네임으로 짓는 게 좋다.

#중복선택/단일선택 폼

방금 문제원인 찾았다...

나는 왜 value값이 제목으로 들어가고 그다음 작성한 값이 셀에서 튀어나오나..

취미선택 1개만 되어야하는데 왜 중복으로 되는가..

뭐가 문제인지 몰라서 밑에 똑같이 다시 써봤는데

인풋타입 radio를 "안닫고 써버려서 name이랑 합쳐진거였다

<label>은 인풋테그 쓸 때 연결해서 자주 쓴다

라벨을 인풋 요소와 연관시키려면 

<input>에 id속성을 넣어야한다. 그런 다음 <label>에 id와 같은 값을 for속성을 넣어야 한다!

(둘이 같이 다녀~)

id는 하나만 됨, 고유함

<fieldset> 하나의 폼에서 여러 구역을 나눠서 표기할 때 사용(그룹화함)

<legend> fieldset으로 묶은 그룹에 제목을 붙여준다

#날짜

근데 얘는 id넣었는데 for안넣어도 되나보네

위에꺼는 라벨, 인풋을 따로써서 연결한거고 라벨 안에 인풋써서 그런가? 흠 알다가도 모르겠구만.

id는 고유한 값으로 한번만 쓸 수 있지만
class는 여러 번 쓸 수 있다! 막써도 됨. 애니메이션 등 모양바꾸고 꾸미는 역할해줌

#

autofocus 는 깜박이는 커서
required 는 반드시 입력해야하만 하는 내용, 빈칸전송시 오류라고 표시됨
placeholder 처음부터 저렇게 표기되어 나타남

lable class="res"

에서  class="res"

은 왜 있는거지??? 

빼본거랑 차이가 없어서 모르겠다.

#select

<select> 선택툴

오 인풋자리에 들어가는거같음 얘도 id로 라벨이랑 연결하는구나..

<option value=""></option>
선택옵션
option value-> 서버에 전송할 값을 뜻함

div 콘텐츠
엄청많이씀!

#경로 조심!!

위처럼 깔끔한 이유는 ul에 스타일 적용했기 때문인데

보통 스타일을 html에 넣지 않고 css파일 만들어서 따로 담아줌

이때 style을 따로 폴더링하니까

링크를 연결해줘야함!!!

style에서 태그로 직접 디자인

{} 비어있다는 뜻

필드셋 너비 500픽셀로

list-style: none;으로

ul의 동글벵이 뺌 (위 이미지가 뺀거임)

list-style
text-align 가로정렬
foat 주위감싸는 텍스트정렬설정
padding-left 안쪽 여백 영역 설정

(style은 body보다 앞에 뜨게 head에 넣어줌)

href에 경로설정! 

아까 계속 스타일이 적용 안돼서 

당황했는데

./에는 없었고

../에는 있더라고! 그렇게 연결했다.