[항해99] 06/3 사전과제 / 준비 웹개발종합반2주차

---

항해 99

 

 

 

 

1. Jquery :     Boostrap에서 include가 이미 되어있음.

            *boostrap tempalte을 안쓰면 import를 해야함

 

https://www.w3schools.com/jquery/jquery_get_started.asp

jQuery Get Started

 

2.

$('#article-url').val("")  // value 가져오기
$('#article-url').val("skyler is the best")  //넣기?

$('#post-box').hide()  //숨기기



temp_html= `<li> ${variable name}</li>`
$('#id').append(temp_html); //  remeber to use `` in the temp_html

 

3.  

 GET -  데이터 조회하기

POST - 데이터 생성 /변경/삭제

 

ajax GET format :

$.ajax({
  type: "GET",
  url: "여기에URL을입력",
  data: {},  //post 에서쓰임
  success: function(response){
    console.log(response)
  }
})

 

 

Quiz 1 

 function q1() {
            $('#names-q1').empty();
            $.ajax({
                type: "GET",
                url: "http://spartacodingclub.shop/sparta_api/seoulbike",
                data: {},  //post 에서쓰임
                success: function (response) {
                    let rows = response['getStationList']['row']
                    for (let i = 0; i < rows.length; i++) {
                        let station_name = rows[i]['stationName']
                        let total = rows[i]['rackTotCnt']
                        let now = rows[i]['parkingBikeTotCnt']

                        console.log(station_name, total, now)
                        let temp_html = ''
                        
                        if (now > 5) {
                            temp_html = `<tr>
                                     <td class="bad"> ${station_name} </td>
                                     <td class="bad">  ${total} </td>
                                     <td class="bad">  ${now} </td></tr>`


                        } else {


                            temp_html = `<tr>
                                     <td> ${station_name} </td>
                                     <td>  ${total} </td>
                                     <td>  ${now} </td></tr>`
                        }


                        $('#names-q1').append(temp_html)
                    }
                }
            })

Quiz2

function q1() {
            $('#names-q1').empty();
            $.ajax({
                type: "GET",
                url: "http://spartacodingclub.shop/sparta_api/seoulbike",
                data: {},  //post 에서쓰임
                success: function (response) {
                    let rows = response['getStationList']['row']
                    for (let i = 0; i < rows.length; i++) {
                        let station_name = rows[i]['stationName']
                        let total = rows[i]['rackTotCnt']
                        let now = rows[i]['parkingBikeTotCnt']

                        console.log(station_name, total, now)
                        let temp_html = ''

                        if (now > 5) {
                            temp_html = `<tr>
                                     <td class="bad"> ${station_name} </td>
                                     <td class="bad">  ${total} </td>
                                     <td class="bad">  ${now} </td></tr>`


                        } else {


                            temp_html = `<tr>
                                     <td> ${station_name} </td>
                                     <td>  ${total} </td>
                                     <td>  ${now} </td></tr>`
                        }


                        $('#names-q1').append(temp_html)
                    }
                }
            })

Quiz3

 function q1() {
            $.ajax({
                type: "GET",
                url: "https://api.thecatapi.com/v1/images/search",
                data: {},  //post 에서쓰임
                success: function (response) {
                    let imgurl =response[0]['url']
                   $('#img-cat').attr('src',imgurl)
                }


            })

 

 

6월3일 항해 99 2기 사전 미팅이 게더타운을 이용해서 진행되었다.

앞으로의 전반적인 커리큘럼 설명 과 부트캠프 운영방식 , 부트캠프후 취직등에 관해서 좋은 정보들과 질문-답변시간이있엇다.