javascript 3

query data 비동기 에러

에러 상황 21번 줄 fetchBoard 데이터가 문제인 듯 하다. console.log로 data.fetchBoard를 찍어 봤더니 역시나 데이터에서 오류가 있는 것 같다. 에러가 뜨는 부분을 주석 했더니 에러는 사라지는 것을 확인할 수 있다. 이상한건 이 상태에서 주석을 풀면 화면이 표시 된다는 것 이건 비동기 실행 때문에 data를 받아오기도 전에 div가 표시되면서 발생하는 에러라고 한다. — 그래서 아래와 같이 조건문을 사용했다. and 연산자는 왼쪽이 ture면 오른쪽을 실행하는 조건문. 아래 코드를 풀이하자면 “&& 연산자 왼쪽의 data가 있을 때 오른쪽을 실행시켜달라”는 뜻 이런 방식으로도 동기실행 상태로 만들어 줄 수도 있다. 다양한 방법으로 변형할 수도 있다. ?를 사용해서 옵셔널 체..

CSS - 선택자

부트캠프 2주차! 커리큘럼을 보니 지난주 프리캠프는 css, html, javascript의 기본을 고루고루 배웠다면 이번주는 CSS를 더 깊게 파고드는 한주가 될 것 같다. 이번 강의에서는 생산성을 높여주는 기능을 먼저 소개했다. 1. emmet(태그와 클래스명을 한번에 입력하는 기능) : 아래와 같이 입력하면 div태그 생성과 함께 클래스도 함께 생성된다. // div.wrapper__header 입력 시 2. 태그 한번에 생성하기 : 태그 뒤에 *n 숫자를 입력하면 원하는 숫자만큼 태그가 생성된다. //div*3 입력 시 총 3개의 div가 한번에 생성된다. 꿀팁 css 선택자 이번 강의에서는 선택자에 대해 배웠다. HTML 태그를 CSS파일로 가져와서 사용할 때 다양한 선택자를 활용할 수 있다. ..

부트캠프 5일차! 회원가입 인증창 만들기

이제 부트캠프를 시작한지 일주일이 다 지나간다. 5일 마지막 과제는 극악의 난이도를 자랑한다... 회원가입 인증창 만들기 1주차 파이널 과제, UI만 봤을 때 금방 끝날 줄 알았다. 실제로 HTML CSS로 UI 작업은 1시간 내로 끝났기에 더 자신감이 있었다. 하지만 문제는 기능 구현 ..! 구현해야할 기능 1. 지역선택하기는 서울, 인천, 경기 가능하도록 구현 2. '지역을 선택하세요'는 선택 불가능하도록 비활성화 3. 남성, 여성 성별 선택은 둘 중에 하나만 선택 가능하도록 구현 4. 휴대폰번호 입력칸에서 3자리 혹은 4자리 번호 입력 조건 만족시 다음칸으로 포커스 이동 5. 휴대폰 번호 모두 입력 시 '인증번호 전송' 버튼 활성화 6. '인증번호 전송' 버튼 클릭 시 6자리 수의 랜덤 토큰 생성 ..