NEXT-LIKELION / Assignment

멋쟁이사자처럼 고려대학교 오프라인 세션 과제입니다.
37 stars 1 forks source link

[6/3 jQuery 과제] #39

Closed gyeol1212 closed 4 years ago

gyeol1212 commented 5 years ago

1. 저번 시간에 실습한 toDoList.html 파일을 올려주세요.

(들어가야 할 항목들은 교안 참고)

2. AJAX의 개념에 대해 이해하고, 자기 나름대로 간단하게 정리해보세요.

3. jQuery의 AJAX를 이용하여, 버튼을 누르면 랜덤하게 강아지 사진이 나오는 html 파일을 만들어주세요.

(랜덤 강아지 사진 API : https://dog.ceo/api/breeds/image/random)

(4. Django + jQuery 실전에 적용하기!) (필수는 아닙니다.)

실습했던 toDoList를 실제 장고와 연결해서 적용해봅시다 (참고 사이트 : https://wayhome25.github.io/django/2017/06/25/django-ajax-like-button/)

Gentleman37 commented 5 years ago

이경연입니다 https://github.com/mangod037/first_repo/tree/master/javascript/ajax

스크린샷 2019-05-31 오전 11 05 59
Gjunghoon commented 5 years ago

권중훈 https://github.com/Gjunghoon/ajax_assignment

  1. todolist

  2. 새로 고침 없이 서버와 비동기적으로 통신하는 기술, jquery에 내장되어 있다

  3. puppy

antlikelion commented 5 years ago

이인우

  1. https://github.com/antlikelion/javapractice
  2. 웹페이지의 일부 정보만 바뀌었을 때 페이지 전체를 새로 불러오는 것의 비효율을 피하기 위하여 부분적으로 정보를 갱신하는 기술이라고 합니다.
  3. 깡생이
parkjihwanjay commented 5 years ago

박지환 https://github.com/parkjihwanjay/ajax_assignment 1.

1 2

2. Ajax : Asynchronous JavaScript And XML의 약어  비동기식 자바스크립트 XML

웹 화면을 갱신하지 않고 필요한 데이터를 서버로 보내고 가져오는 방법.

화면 갱신이 없기 때문에 사용자 입장에서 굉장히 편리하고 빠른 작업 가능

*동기식, 비동기식

-동기식 -> 업들 사이의 수행 시기를 맞추는 것. 사건이 동시에 일어나거나, 일정한 간격을 두고 일어나도록 시간의 간격을 조정하는 것  서버로 데이터를 요청하고 응답이 오는 시간동안 작업을 멈추고 기다려야 한다.(ex)로그인 화면)

-비동기식 -> 서버로 데이터를 요청하고 응답을 기다리는 동안 웹은 자신의 다른 업무를 진행하고 응답이 오면 그 후 작업을 진행. -> 화면 갱신 필요 x

3.

멍 댕댕이

javascript와 jquery 둘다 사용해 봤습니다. 4. https://github.com/parkjihwanjay/api_usage

캡처

댓글 작성, 삭제, 전체 삭제 다 새로고침 없이 가능합니다.

SoniaComp commented 5 years ago

1.https://github.com/SoniaComp/NEXT/blob/master/javascript/session_3.html 2. Ajax는 웹페이지 전체 리소스를 리로드 하지 않고, 웹페이지에서 부분적으로, 비동기적으로, 서버와 데이터를 주고받는 작업을 도와주는 기술입니다.

  1. https://github.com/SoniaComp/NEXT/tree/master/ajax_assignment 스크린샷 2019-05-31 오후 7 01 53

    4.https://github.com/SoniaComp/my_blog_django/tree/master/book/todo 화면녹화: 나의 동영상.mp4.zip 참고 1: https://simpleisbetterthancomplex.com/tutorial/2016/11/15/how-to-implement-a-crud-using-ajax-and-json.html#delete-book 참고 2: https://simpleisbetterthancomplex.com/tutorial/2016/08/29/how-to-work-with-ajax-request-with-django.html

SeeunChoi1 commented 5 years ago
  1. toDoList(아이콘 바껴욧) image image

  2. 전체 페이지를 리로드하지 않고도 데이터를 불러올 수 있는 기법입니다. 서버처리를 기다리지 않아도 되기때문에 화면을 더 빠르게 전환할 수 있습니다.

  3. 댕댕이 image 최세은 https://github.com/SeeunChoi1/JavaScript_beginner

miramira227 commented 5 years ago

김미라 https://github.com/miramira227/JQUERY-AJAX.git

과제 1 댕댕쓰

과제 2 Ajax는 자바스크립트의 라이브러리 중 하나이며, 브라우저가 가지고 있는 XMLHttpRequest 객체를 이용해 전체 페이지를 새로고침하지 않고도 페이지의 일부만을 위한 데이터를 로드하는 기법이다. 이 방식의 장점은 불필요한 리소스 낭비가 발생하지 않으며 또한 웹페이지의 속도가 향상되고, 서버의 처리가 완료될 때까지 기다리지 않고 처리가 가능하다는 것이다. 전체적인 코딩의 양도 줄어들지만 연속으로 데이터를 요청하면 서버 부하가 증가할 수도 있다.

과제 3 투두리스트

운영진 분들 한 학기동안 고생많으셨습니다 감사합니다! 🥇

RyanKor commented 5 years ago

김승태

과제 1. image

과제 2. AJAX의 경우 지난 미니톤에서 Subclass에 형성된 새로운 게시글이 메인 페이지에 새로 고침 없이 뜨게끔 사용하고자 시도했던 적이 있습니다. 아마 HTML 파일을 기존에는 변경사항을 보려면 새로고침을 했어야 되는데 사용자가 번거롭게 새로고침하지 않고 화면에 새로운 변경사항을 볼 수 있게끔 돕는 것이 AJAX가 아닌가 생각해봅니다.

과제 3. image

Git URL : https://github.com/RyanKor/Next-x-Likelion/tree/master/jqueryassignment

woojeee commented 5 years ago

마동석 toDoList

dog

https://github.com/woojeee/JS_toDoList-AJAX_Dog.git

jojoboy2212 commented 5 years ago

도대체 다들 영상으로 업로드 어케해여... 화면 오 찾았어요!!!!!!

  1. Jun-03-2019 12-14-39

  2. Ajax 는 네덜란드의 에레디비시에 속하는 축구 팀으로 이번 챔피언스리그에서 토트넘과 4강에서 만났다.... Ajax는 JavaScript와 xml을 이용하여 비동기 통신을 하는 기능으로 페이지를 새로고침 하지 않고 동적인 변화를 확인 할 수 있도록 한다. 이를 jQuery를 이용하면 보다 더 쉽게 사용할 수 있다고 한다.

Jun-03-2019 12-43-30 https://github.com/jojoboy2212/jquery_ajax

wSuhye commented 5 years ago

안수혜 https://github.com/wSuhye/js <과제1> todolist

<과제2> Ajax는 화면을 새로고침하지 않고도 데이터를 주고받을 수 있게 하는 것이다. 이를 통해 웹페이지의 처리 속도를 빠르게 할 수 있다.

<과제3> dog

vhvha commented 5 years ago

장주희 https://github.com/vhvha/jquerywork2 올해의 강아지

gaetokk commented 5 years ago

안태경 https://github.com/gaetokk/javascript ajax는 해당 웹 페이지 전체가 아닌 페이지의 일부분만을 로딩해서 변경할 수 있는 방법이라고 생각합니다. ajax과제2 todo

YUNALEEEE commented 5 years ago

이유나 과제 1. https://github.com/YUNALEEEE/javascript_assignment/blob/master/todoList2.html todoList

과제 2. 비동기적인 웹애플리케이션 제작을 위한 웹 개발 기법. 필요한 데이터만을 웹서버에 요청해서 받은 후 클라이언트에서 데이터에 대한 처리를 할 수 있기 때문에 효율적이다.

과제3. https://github.com/YUNALEEEE/javascript_assignment/blob/master/puppy.html https://github.com/YUNALEEEE/javascript_assignment/blob/master/puppy.css puppy

hoiJuwon commented 5 years ago

1.

스크린샷 2019-06-03 오후 4 10 36

2. Ajax 란 Asynchronous JavaScript and XML 의 약자로, 전체를 갱신하지 않고 웹페이지의 일부분만을 갱신 할 수 있는 기법의 하나입니다.

3.

스크린샷 2019-06-03 오후 3 48 05

https://github.com/hoijuwoncodes/final_assignment.git

chaeyeonie commented 5 years ago

이채연 ajax : 서버에서 필요한 데이터만을 챙겨오는 친구 image

image

실패했어요ㅜㅜ https://github.com/chaeyeonie/jshw2.git

juno1028 commented 5 years ago

김준오 https://github.com/juno1028/190530 1.

Screen Shot 2019-06-03 at 4 49 35 PM
  1. ajax는 데이터를 불러올 때 전체 페이지를 새로고침하지 않고, 필요한 부분만 갱신하여 데이터를 가져오는 효율적인 방식입니다.
  2. Screen Shot 2019-06-03 at 4 47 49 PM
swcho9919 commented 5 years ago

스크린샷(56) 스크린샷(57) 스크린샷(70) 조성우 AJAX 내용 summary  Ajax는 Asynchronous JavaScript and Xml의 준말이다  짧게 말해 ajax는 페이지를 새로고침하지 않은 상태에 새로운 데이터를 보여 줄 수 있게 하는 툴이다  Ajax를 써서 만든 서비스는 gmail, google maps, 유툽, 페북 등이 있다  jQuery와 ajax를 같이 쓰면 text, HTML, XML, JSON를 HTTP Get과 HTTP post 방식으로 가져올 수 있다

장고 써서 해봤는데...ㅎㅎ..;;;디버깅이 안돼요... https://github.com/swcho9919/Javascript_first

kimjaehun96 commented 5 years ago

김재훈 1. jquery_ass1

  1. AJAX는 페이지 리로딩 없이 웹 브라우저 안에서 페이지 전체가 아닌 일부분의 데이터를 처리할 수 있게 해주는 프로그래밍 언어다.

페이지 웹 서버가 처리할 데이터를 줄여주면서( 너무 많은 데이터를 요청하면 더 느려질 수도 있지만!) 화면 전환을 빠르게 할 수 있다.

  1. ajax1 https://github.com/kimjaehun96/java/tree/master/thirdClass

KimKangYeon commented 5 years ago

김강연

  1. https://github.com/KimKangYeon/js.homework image

  2. Ajax는 웹페이지 전체를 리로드 하지 않아도 될 때 웹페이지에서 부분적으로만 효율적으로 변경하기위한 것으로 서버와 데이터를 주고받는 작업을 도와주는 기술이라고 생각합니다.

  3. image

elksha commented 5 years ago

김준태 https://github.com/elksha/Next/tree/master/js

  1. 1

  2. 효율적인 동기화를 위해서 일부분만 동기화하는 것

  3. GIF

NamJaeyong commented 5 years ago

남재용 https://github.com/NamJaeyong/halflastNam.git image 과제 2. 전체 페이지를 새로고침을 안해도 일부분만 새로 데이터를 가져오는 것 image

updownC commented 5 years ago

최상하

new

애견인입니다.. https://github.com/sanghaC/likelion7/tree/master/JQuery