수업 전 워밍업 때 알게 된 것들
개발할 때 순서
-> 빈화면 -> 버튼 -> 액션 하나씩 추가
자바스크립트
event driven 방식(자기가 호출되면 동작하고 끝남 => 순서는 보장이 되는데 절차가 보장이 안됨)
funA() {
const x = funX() // x에 X를 리턴시켰다 치고 담겠다
console.log(x) // 그럼 x에 X가 있으니까 X가 콘솔에 찍혀야할 것 같지만 undefined
} // (데이터가 담기기 전에 console.log가 먼저 동작해버림)
주의
vue에선 await를 사용하지 않는다.(Store에서 대신 해줌)
-> 이걸 적응 못하면 끔찍한 혼종을 탄생시킬 수 있다...
코딩 순서는 사용자 인식의 반대 방향
<사용자의 순서>
정보 입력 --> 등록요청 --> 등록접수(여기부턴 백엔드) --> 로직동작 --> DB호출 --> DB입력
그러나 코딩은 반대로 되어야함(DB가 있어야 호출을 하고 DB 호출을 할 수 있어야 로직이 동작하게 할 수 있고...)
하지만 코딩 순서대로 짜기가 어려울 수 있기 때문에 저렇게 짜진 않음
개발 공부는 모자이크처럼 해야함 계속 반복하면서 익숙해지고 이해하게되면 점점 선명해짐
오늘은 CRUD를 중점으로 사용자 관리 화면을 만들었다.
- key 값엔 절대 한글이 들어가면 안되기 때문에 fields를 이용했다.
- 코드는 간단할수록 좋다 -> bootstrap vue에서 가져올때 필요한 기능만 있는 최대한 간단한 코드부터 가져올 것, 그리고 옵션을 붙일 것
- 붙여넣기할 때 위치는 괄호로 살펴보면 정확
- @click의 @는 action
- methods 등에 넣을 땐 순서 맞춰서! 보통 methods에 먼저 만들고 그걸 복사해서 위에 붙여넣으며 씀
-> 평범하면 이름 못찾으니 가능한 유니크한걸로
- 주의! 변수는 camelCase로 써야됨
- 비밀번호 설정 주는 건 엄청 간단하네... type="password"
vue-good-table에 테이블의 데이터를 필터링해서 보여주는 검색기능 있음
사용한 bootstrap 기능
Table, Form group, buttons, Layout and Grid, Modal, FormRadio
느낀 점
확실히 똑같은 걸 여러번 하니까 처음보단 훨씬 낫다.
그 사실이 희망이다.
왜 초반에 잘 모를 때 하드코딩을 (하면 안되는데) 많이 하게 된다고 하는지 알 것 같다...
중간중간 백엔드를 막판에 우다다 할 때가 떠오르는 시점들이 있었다..
받아들여야할 지식이 정말 많다.
하나하나는 어려운게 아닌데 vue, 자바스크립트, html, 부트스트랩이 다 섞이면서 복잡해보이는 느낌?
정말 거대한 모자이크 속에 갇힌 기분이다ㅎ
선명해지도록 헤매면서 길을 찾는 수밖에...
'공부 > Boot camp' 카테고리의 다른 글
TIL_211227_Frontend (0) | 2021.12.27 |
---|---|
TIL_211224_Frontend (0) | 2021.12.25 |
TIL_211222_Frontend (0) | 2021.12.23 |
TIL_211221_Frontend (0) | 2021.12.21 |
TIL_211220_Frontend (0) | 2021.12.20 |