brunch

매거진 개발일지

You can make anything
by writing

C.S.Lewis

by yurikim Nov 08. 2022

웹개발종합반 개발일지 2주차-2

스파르타코딩클럽 웹개발종합반

1. 수강목적 : 코알못탈출 웹디자인에 필요한 기본지식 습득

2. 배운점 : 



$(document).ready(function(){});

페이지가 로딩되면 {}안에 있는 내용을 수행합니다.



$.ajax({
    type: "GET",
    url: "URL입력",
    data: {},
    success: function (blabla) {

데이터를 불러오는 방식이다. 그냥 복붙해서 사용. 데이터에 가져오는 것에 성공하면 blabla 함수를 수행합니다. 


let temp = blabla['temp']
let tempstyle = temp.toFixed(1);
$('#temp').append(tempstyle)

temp를 위에서 불러온 데이터의 'temp'영역으로 지정합니다. 강의에서는 이걸 id가 먹인 <span>에 적용해서 날씨를 나타내도록 하였는데 데이터의 기온이 소수점 2자리까지 나타나 있는것이 과하다고 생각하여 소수점을 잘라내는 기능을 찾았다. toFixed();인데 자리수를 ()안에 써주면 잘라준다. 그래서 tempstyle을 하나 더 만들어서 위에서 가져온 temp데이터의 소수점1자리까지 자른 후 그걸 temp가 id값으로 지정된 부분에 추가해주었다.


그런데 이럴게 아니라 아예 let temp = blabla['temp'].toFixed(1); 이렇게 하면 되는거 아닌가?


success: function (blabla) {
    let temp = blabla['temp'].toFixed(1);
    $('#temp').append(temp)
}

요렇게 수정하니 아까와 같이 잘 적용되었다.



그리고, 이 숙제 전에 따릉이 api를 가져와서 목록을 만들고, 거치된 따릉이가 5개 이하인 곳은 빨간 글씨로 클래스 값을 입력하는 작업을 하였는데, 아무리 해도 빨간글씨로 안나오는 것이었다. 뭐가문제일까 코드 복붙 다 해와봐도 안되고 절망에 빠져있었는데, 예상 밖의 곳에서 오타가 발견되었다.


css에서 

color = red;

라고 썼던것...

color : red; 로 바꿔주니 정상작동되었다. 후...그런데 표의 테두리 값도 같이 red로 출력되어서 보더스타일도 추가해주었다. 오타와의 전쟁이었다... 


.red > td{
  font-weight:bolder;
  color:red;
  border-color:black;
}

폰트 두께는 두껍게, 보더컬러는 블랙으로 지정하였다.



3. 보완할점

보면서해도 하나씩 꼭 빼먹는다. length도 계속 자연스럽게 lenght로 써서 오류가 몇번이 났는지... 확인 잘하기~~



4. 앞으로의 계획

완강

브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari