Today I Learned
TIL] ajax와 api활용하기
ajax ajax란 자바스크립트의 라이브러리중 하나이다. 브라우저가 가지고있는 XMLHttpRequest 객체를 이용해서 전체 페이지를 새로 고치지 않아도 페이지의 일부를 로드하는 기법이다. 쉽게 풀어서 설명하자면 자바스크립트를 통해서 클라이언트와 서버간에 데이터를 주고 받는 기술이다. 비동기방식 비동기 방식은 웹페이지를 리로드하지 않고 데이터를 불러오는 방식이다. ajax를 통해서 서버에 요청한 후 멈추는 것이아니라 프로그램은 계속 돌아가는 것이다. 비동기 방식의 장점은 필요한 부분만 불러와 사용할 수 있기 때문에 불필요한 리소스 낭비가 발생하지 않는다. 따라서 비동기식의 장점은 다음과 같다. 웹페이지의 속도가 빨라진다. 서버의 처리가 완료될 때까지 기다리지 않고 처리가 가능하다. 서버에서 데이터만 전..
TIL]자바스크립트 기초
alert 위의 코드를 살펴보면 html 코드가 input-info라는 정보가 없지만 간단히 설명하면 해당 빈칸에 아무 정보도 기입되지 않았다면 경고창 "입력하세요!"가 나타나고 정보를 기입한다면 경고창 "입력된 정보"가 나타나게 된다. 위의 코드는 변수명을 따로 지정하지 않았지만 지정이 가능하다. let info = $('#input-info').val() ["tistory", "gmail.com"] ["gmail.com"] ["gmail", "com"] [gmail] 이런 작업을 거치게 된다. 위의 코드도 더욱 보기 좋게 변수명을 지정할 수 있기 때문에 다음부터 코드를 짤 때 누가 봐도 알아볼 수 있는 코드를 짜야겠다! 자바스크립트는 아직 익숙하지 않다. 그래서 자잘한 실수와 가시성이 좋은 코딩을 짜..
TIL]html 및 자바스크립트 기초
let a = 2 # a라는 박스를 꺼내서 그 안에 2를 담았다라는 뜻 딕셔너리는 키값과 밸류 값으로 이루어져 있다. let a_dict={'과일이름':'사과','가격':5000} #a_dcit["과일이름"]의 결과값 : "사과" 만약 딕셔너리에 새로운 키값과 밸류 값을 추가하려면 어떻게 해야 할까? 다음과 같이 추가하면 된다. a_dict['원산지'] = '국내산' #a_dict의 결과값 = {과일이름:"사과",가격:5000,원산지:"국내산"} 또한 추가로 딕셔너리에는 리스트도 추가가 가능하다. 글자 나누기 자바스크립트로는 글자를 나눌 수 있는데 다음 코드를 살펴보자 let email = "nerd@daum.net" email.split('@') #결과값 = ["nerd","daum.net"] emai..
TIL] html 기초 및 css
html 기초 웹브라우저의 개발자 도구에 들어가 바꾸고 싶은 부분을 내가 원하는 문구로 바꾸게 되면 내가 원하는 문구로 수정된 것을 볼 수 있다. 1. 전세계의 사람들이 문구가 수정된 것을 보는 것이 아닌 내가 보고 있는 페이지만 바뀐다. 2. 내가 보고있는 페이지는 사실 인터넷과 관련이 없다. 3. 새로고침을 한다면 원상 복귀한다. 새로고침을 하면 원상복귀되는 이유: 새로고침 버튼을 누르면 서버로부터 새로운 정보를 요청하고 받아오기 때문이다. 브라우저의 역할: 1. 서버에게 요청 - > 결과물을 받아서 그려주는 개념 웹사이트에서 보여지는 요소는 크게 세 가지이다. 1. html : 밑그림(뼈대) 2. css : 물감(보기 좋게 꾸며주는 것) 3. 자바스크립트 : 움직이는 것 반응에 대한 대응 html ..