Node.js & TypeScript

Haker News project part 1

martinooo 2021. 7. 26. 23:44
728x170

Haker News Api를 Ajax 활용해서 어플리케이션을 개발해 보겠습니다!

Haker News Project 기본적인 어플리케이션 개발을 위한 기본 연습입니다! 

part1 부터 단계별로 나아가며 마지막에 기본적인 typescript 활용해보겠습니다!

 

다같이 공부해봐요!!

 

Part1 = 12줄 Ajax 코드 짜기 

 

 

코드참고는 저의 git에 올려두었습니다

https://github.com/yoogukhyeon/FrontendProject1/tree/code1

 

GitHub - yoogukhyeon/FrontendProject1: FrontendProject1 개발의 기본

FrontendProject1 개발의 기본. Contribute to yoogukhyeon/FrontendProject1 development by creating an account on GitHub.

github.com

 

 

 

가장먼저!

index.html 만들기 프로젝트 끝날때까지 똑같은 코드입니다!

 

ajax로 api호출해서 브라우저 출력하기

ajax 비동기 통신을 활용해서 해커뉴스 api불러들려서 브라우저에 해커뉴스 제목10개를 출력합니다

ajax.response 앞에 붙은 JSON.parse 중요한 json 객체에 메소드 입니다.

먼저 JSON.parse 에서 인자로 전달한 값은 자바스크립트 객체로 변화해줍니다

그리고 변수에 할당해서 브라우저에 title 출력한 형태 입니다!

 

bo0mmmmmm

다음 part는 2개의화면웹앱만들어 보겠습니다! 

 

그리드형

'Node.js & TypeScript' 카테고리의 다른 글

Haker News Part 3 코드 리팩터리  (6) 2021.07.29
Haker News project part2  (8) 2021.07.29
Modern JavaScript & TypeScript 개발환경  (10) 2021.07.21
TypeScript  (10) 2021.07.20
Node.js 는 무엇인가?  (20) 2021.07.06