Django 앱에서 jQuery 사용
이 기사에서는 jQuery에 대한 간략한 소개에 대해 설명합니다. 그리고 Django 앱에서 jQuery를 사용하는 방법도 배우게 됩니다.
Django 앱에서 jQuery 사용
jQuery는 지금까지 세계에서 가장 인기 있는 JavaScript 라이브러리로, 전 세계 100만 개 웹사이트 중 80% 이상에서 찾을 수 있습니다. 2006년 John Resig에 의해 발명되었으며 jQuery의 인기는 웹 개발 시장의 근본적인 요구에 의해 주도되었습니다.
이 짧은 기사는 jQuery를 Django 앱과 연결하는 방법을 보여줍니다. 이 앱에서는 날짜 기능이 있는 양식을 만들었는데, 수동으로 입력해야 하는 문제가 있어 사용자 친화적이지 않습니다.
사용자가 입력 필드를 클릭하여 달력에서 날짜를 선택할 수 있는 사용자 친화적인 날짜 선택 기능을 추가합니다. 날짜를 선택할 수 있는 팝업 캘린더로, 애플리케이션을 보다 쉽게 사용할 수 있습니다.
이를 달성하려면 아래 몇 가지 단계를 수행해야 합니다.
-
먼저 이 웹사이트에서 jQuery를 다운로드하고 이전 버전이 jQuery UI와 잘 작동하지 않기 때문에 현재 버전을 선택하는 것입니다. 현재 버전의 jQuery로 이동하여 압축 파일을 다운로드합니다.
-
클릭하면 브라우저에서 소스 코드를 열고 다른 이름으로 저장하고 정적 주장이 있는 곳으로 이동합니다.
-
여기에서 jQuery UI를 다운로드합니다. 테마 탭을 클릭하고 아래로 스크롤한 다음 왼쪽에 있는 갤러리 버튼을 클릭해야 합니다.
-
좋아하는 테마를 선택하고 다운로드 버튼을 클릭하십시오. 다음 페이지에 도달하면 정적 디렉토리에 다운로드합니다.
-
코드가 있는 HTML 파일을 열고 맨 아래 어딘가에 코드를 작성합니다. 이들은 모두 CSS 파일입니다. 일반적으로 CSS를 페이지 상단에 배치하는 것을 좋아합니다.
우리는 jquery-3.6.0.min 버전을 사용하고 있습니다. 이 기사를 읽고 있다면 jQuery 버전이나 jQuery UI를 변경해야 할 수도 있습니다.
-
우리의 경우 JS 스크립트가 있는 맨 아래에 유지합니다.
-
이제 정적 디렉터리에 있는 JS 폴더에 JS 파일을 만들고 이 코드를 JS 파일에 작성하고 저장해야 합니다. jQuery를 사용하고 싶다면 우리가 했던 것처럼 jQuery 코드를 작성하는 별도의 파일을 생성할 수 있습니다.
-
이제 JS 스크립트가 작성된 HTML 파일에 짧은 스크립트를 작성합니다. 별도의 파일을 사용하는 경우 이 경우
custom.js를 정의한 대로 스크립트 경로에 이름을 지정할 수 있습니다.
-
작동하는지 여부를 살펴 보겠습니다. 날짜 선택기에서 날짜를 선택할 수 있음을 알 수 있습니다.
참고: 이 문서는 데모용이지만 Django에서 jQuery를 사용하는 경우 코드와 접근 방식은 동일합니다. 어떤 용도로든 jQuery를 사용할 수 있습니다.
Hello! I am Salman Bin Mehmood(Baum), a software developer and I help organizations, address complex problems. My expertise lies within back-end, data science and machine learning. I am a lifelong learner, currently working on metaverse, and enrolled in a course building an AI application with python. I love solving problems and developing bug-free software for people. I write content related to python and hot Technologies.
LinkedIn