강의

멘토링

로드맵

BEST
Programming

/

Full-stack

Blog Vue-Django-Bootstrap nhanh chóng

인기 3 bộ ba (Vue + Django + Bootstrap) giúp bạn tạo ra một blog đẹp mắt và dễ dàng. Trang web có khả năng phản hồi và có thể xem trên cả điện thoại thông minh.

(4.8) 12 đánh giá

292 học viên

  • bestdjango
Vue.js
Django
Bootstrap

Đánh giá từ những học viên đầu tiên

Dịch cái này sang tiếng Việt

  • Lập trình web Python sử dụng Django

  • jQuery thay thế bằng Vue.js

  • Sử dụng chủ đề/mẫu miễn phí của Bootstrap

Blog của riêng tôi, được tạo ra trong chớp mắt bằng chính đôi tay của tôi 🏠
Phát triển web bằng Vue + Django + Bootstrap!

Di chuyển danh mục, để lại bình luận và tự thực hiện phân trang.

Bạn cũng có thể triển khai giao diện người dùng scrollspy trong đó menu thay đổi tùy thuộc vào thao tác cuộn.

Dễ dàng và nhanh chóng
Phát triển web tuyệt vời
?

Trong lập trình web, giao diện người dùng (UI) ngày càng trở nên đẹp mắt hơn.
Đó là lý do tại sao bất kỳ người mới bắt đầu nào cũng có những lo lắng. 'Mình không thể tạo ra một cái mạng lưới đẹp được sao?' Và cứ thế tiếp tục.

Hãy để tôi trả lời cho bạn câu hỏi này.
Điều này có thể thực hiện được với Vue.js + Django + Bootstrap .

  • Đầu tiên , chúng ta lập trình web bằng cách liên kết Vue và Django.
  • Thứ hai , đối với UI, chúng tôi sử dụng các chủ đề được Bootstrap hỗ trợ.

Cả ba đều là những nền tảng phổ biến mà nhiều người sử dụng và cho biết là dễ sử dụng.
Trong bài giảng này, chúng ta sẽ tìm hiểu các nguyên tắc và công nghệ cốt lõi của phát triển web giúp liên kết phần front-end và back-end trong khi tạo ra một trang web blog tuyệt vời. Chúng ta cùng xem nhé?


Đối với những người này
Tôi khuyên bạn nên làm vậy.

Hãy kiểm tra kiến ​​thức chơi game của bạn!

  • Khóa học này dành cho những người có kiến ​​thức cơ bản về Vue.js và Django.

Dễ dàng và nhanh chóng
Lập trình web tuyệt vời
Bất cứ ai muốn làm điều đó

Đã thực hiện
Sử dụng chủ đề
Bất kỳ ai muốn tạo ra một giao diện người dùng tuyệt vời

Xu hướng công nghệ
Giao diện/Phần cuối
Bất kỳ ai muốn kết nối

Bạn có đang lo lắng những điều này không?

  • Khóa học này dành cho những người biết các chức năng cơ bản của Django và Vue.js.

Tôi có thể làm một hướng dẫn, nhưng
Có những lúc bạn sẽ gặp khó khăn khi tự mình làm việc đó.

Tôi có thể lập trình web đơn giản, nhưng
Tôi không thích giao diện người dùng .

Tôi biết cách sử dụng Django, nhưng không biết cách sử dụng front-end.
Tôi muốn sử dụng Vue.js, một công nghệ tiên tiến.

Tôi biết cách sử dụng Vue.js, nhưng không biết cách sử dụng nó như một công nghệ máy chủ.
Tôi muốn sử dụng Django .

  • Tôi đang sử dụng Django, nhưng tôi liên tục gặp lỗi và bị kẹt.
    👉 Mặc dù Django có nhiều tính năng và chức năng giúp các nhà phát triển làm việc dễ dàng hơn, nhưng bạn cần hiểu rõ những tính năng đó để có thể xử lý lỗi. Để thực hiện điều này, chúng tôi sẽ hướng dẫn bạn cách đọc tài liệu Django và giải thích chi tiết nội dung chính.
  • Tôi muốn tạo ra một giao diện người dùng tốt hơn giao diện chúng ta đang có hiện nay.
    👉 Ai cũng muốn có một UI tuyệt vời, nhưng đây là lĩnh vực đòi hỏi công nghệ front-end và tư duy thiết kế, do đó cần phải có nghiên cứu riêng. Hướng dẫn này sẽ hướng dẫn bạn cách sử dụng các theme Bootstrap có sẵn. Bởi vì đây là giao diện người dùng tuyệt vời được tạo ra bởi các chuyên gia, nhưng cũng là cách tuyệt vời để người mới bắt đầu sử dụng.
  • Tôi muốn tạo các tính năng không đồng bộ/tương tác như thích/đề xuất từ.
    👉 Tính năng bất đồng bộ/tương tác gần như là yếu tố cần thiết trong các ứng dụng web. Nếu bạn đã từng viết mã bằng jQuery, khóa học này sử dụng Vue.js. Bởi vì Vue là công nghệ tiên tiến có thể thay thế mọi tính năng của jQuery và cải thiện hiệu suất.
  • Tôi muốn tạo một chương trình web có thể chạy trên điện thoại thông minh.
    👉 Mẫu Start Bootstrap được sử dụng trong khóa học này hỗ trợ hành vi phản hồi theo mặc định. Vì vậy, bạn có thể tạo các trang web hoạt động trên cả PC và điện thoại thông minh mà không cần bất kỳ mã hóa riêng biệt nào.

Tại sao khóa học này đặc biệt
Tôi muốn thông báo cho bạn.

Sau khi nghe xong bài giảng này!

  • Bạn có thể học cách sử dụng axios/JsonResponse để tích hợp Vue-Django.
  • Các hàm được tạo bằng jQuery giờ đây có thể được tạo bằng công nghệ mới nhất, Vue.
  • Bạn có thể tự mình sử dụng các chủ đề/mẫu Start Bootstrap.
  • Bạn có thể thấy rõ ràng rằng chế độ xem dựa trên lớp của Django có nhiều ưu điểm.

Đây là khóa học phát triển web chú trọng vào ứng dụng.

Không chỉ đơn thuần nói rằng 'chương trình web chạy được' và 'bạn có thể viết mã', chúng tôi đã cố gắng truyền đạt các nguyên tắc hoạt động và kiến ​​thức nền tảng của Django. Theo cách đó, ngay cả khi bạn học được một điều, bạn vẫn có thể áp dụng và mở rộng thành mười điều.

Ngoài ra, mặc dù nội dung chính hướng đến các chức năng dành cho người mới bắt đầu, khóa học được cấu trúc để bao gồm các chức năng trung cấp như ▲Phân trang ▲Truyền dữ liệu bằng JS ▲Liên quan đến tìm nạp trước, v.v. để bạn có thể tiến xa hơn một chút.

Cuối cùng, tôi cố gắng giúp mọi người hiểu rõ hơn bằng cách viết nội dung quan trọng trong PPT và giải thích trong video. Cung cấp mã nguồn và tài liệu được sử dụng trong bài giảng.

Đây là ưu điểm của bài giảng này so với phương pháp liên kết Ứng dụng trang đơn thông thường.

  • Tích hợp Vue-Django mà không cần phải sử dụng VueRouter/Vuex/DRF.
  • Đây là phương pháp tích hợp Vue-Django nhưng sử dụng chức năng Admin của Django.
  • Django không chỉ có thể được sử dụng như một máy chủ API mà còn có thể được sử dụng để xử lý mẫu.
  • Nếu cần, bạn có thể sử dụng lại chức năng xác thực của Django.

Django Rest Framework rất tuyệt vời, nhưng nếu nó thường xuyên bị chặn thì sao?

  • DRF có vẻ dễ lúc đầu, nhưng thực tế lại rất khó áp dụng.
  • Có thể là do bạn không quen với chức năng tuần tự hóa, kế thừa lớp và ghi đè của DRF.
  • Tôi khuyên bạn nên học các kỹ thuật cơ bản thông qua khóa học này và sau đó sử dụng DRF khi cần thiết.
  • Điều này là do công nghệ cơ bản của DRF là chế độ xem dựa trên lớp (CBV).

Theo thứ tự sau
Tôi đang học.

Sử dụng chủ đề Start Bootstrap

Tìm hiểu cách tải xuống và sử dụng các giao diện và mẫu của Bootstrap và sửa đổi giao diện trong Django.

Phát triển ứng dụng blog với Django

Tìm hiểu cách tạo cấu trúc cơ bản của ứng dụng blog bằng Django.

Phát triển API Vue-Django

Tìm hiểu lợi ích của việc tích hợp Vue.js với Django và thiết kế API.

Nhiều chức năng mở rộng khác nhau

Tìm hiểu về nhiều tiện ích mở rộng khác nhau như phân trang, truyền dữ liệu bằng JS, hàm mã thông báo CSRF, v.v.

Cải thiện hiệu suất truy vấn DB

Cải thiện truy vấn để nâng cao hiệu suất cơ sở dữ liệu.

Xem trên điện thoại thông minh

Tìm hiểu công nghệ web phản hồi để màn hình của bạn có thể hiển thị phù hợp trên các thiết bị di động như điện thoại thông minh, máy tính bảng cũng như máy tính để bàn.


Những câu hỏi thường gặp
Hãy xem thử nhé.

H. Đây là lần đầu tiên tôi sử dụng Python-Django. Tôi có thể theo dõi bài giảng được không?

Yêu cầu có kinh nghiệm lập trình web bằng Django. Sau đó, bằng cách thêm Vue, bạn sẽ tạo ra một chương trình với phương pháp tích hợp Vue-Django nâng cấp như bài giảng này.

H. Tôi có phải sử dụng chế độ xem không? Tôi không thể lập trình web chỉ bằng Django được sao?

Tất nhiên, điều này hoàn toàn có thể thực hiện được chỉ với Django. Tuy nhiên, sử dụng chế độ xem sẽ nâng cấp giao diện người dùng của bạn. Xử lý UI ở phía máy khách hiệu quả hơn nhiều so với xử lý ở phía máy chủ. Trong bài giảng này, chúng ta sẽ sử dụng jQuery ở cấp độ jQuery. Sau khi hoàn thành bài giảng và nghiên cứu thêm một chút, bạn sẽ có thể triển khai các tính năng UI nâng cao như hoạt ảnh.

H. Tôi có thể sử dụng React thay cho Vue không?

điều đó là có thể. Mã liên kết và mã bên Django giống hệt nhau. Bạn chỉ cần thay đổi mã xem thành React.

Cả Vue và React đều là những framework tốt, vì vậy bạn có thể chọn framework phù hợp với tình huống của mình. Tuy nhiên, hãy nhớ rằng khi sử dụng các tệp HTML hiện có như trong bài giảng này, Views có lợi thế hơn nhiều so với React.

H. Họ nói rằng nó dễ, nhưng điều gì làm cho nó dễ?

Khi tích hợp Vue-Django, trong nhiều trường hợp người ta sử dụng Vue Router, Vuex, DRF, v.v. Bạn không nhất thiết phải sử dụng cả ba thứ này. Lượng thời gian học tập cũng giảm đi tương ứng.

Ngoài ra, nó sử dụng các chủ đề Bootstrap có sẵn trên Internet, vì vậy bạn có thể tạo giao diện người dùng (UI) một cách nhanh chóng, dễ dàng và đẹp mắt.

H. Nó khác với các bài giảng khác của người chia sẻ kiến ​​thức như thế nào?

Mức độ khó nằm giữa phần cơ bản và phần thực hành trong bài giảng Inflearn của tôi (tích hợp Vue-Django).

So với phiên bản thực tế, ứng dụng blog vẫn giống nhau, nhưng đã thêm chức năng thích không đồng bộ và xử lý biểu mẫu bình luận, đồng thời chức năng phân trang được mã hóa trực tiếp.

Sự khác biệt lớn nhất là chúng tôi sử dụng Bootstrap thay vì Vuetify và bạn có thể tự mình sử dụng nhiều chủ đề khác nhau, đặc biệt là khi học cách sử dụng mẫu Start Bootstrap có sẵn.


Người chia sẻ kiến ​​thức
Bạn có tò mò về các bài giảng khác không?

Khuyến nghị cho
những người này

Khóa học này dành cho ai?

  • Dành cho những ai muốn lập trình web dễ dàng, nhanh chóng và thú vị

  • Bất kỳ ai muốn tạo giao diện người dùng thú vị bằng cách sử dụng các chủ đề có sẵn

  • Front/Backend là xu hướng công nghệ mà bạn muốn biết cách kết nối

Cần biết trước khi bắt đầu?

  • Để làm theo hướng dẫn và lớp xem Django, bạn phải có kinh nghiệm lập trình.

  • Bạn phải biết các chỉ thị cơ bản của Vue.js (v-for, v-if, v.v.).

Xin chào
Đây là

2,091

Học viên

153

Đánh giá

224

Trả lời

4.6

Xếp hạng

5

Các khóa học

프로그램 개발은 C 언어로 시작했으며, 자바를 거쳐 최근에는 주로 파이썬을 사용하고 있다.
KT ucloud 서비스의 백엔드 서버 개발 프로젝트에 참여하여, 자바로 고객의 폴더/파일에 대한 메타 정보 처리 엔진을, 파이썬으로 클라이언트 푸시 서비스를 개발하였다.

또한 KT인터넷 회선의 속도 측정 프로그램, 네트워크 장비에 대한 운용관리 프로그램, 방대한 양의 트래픽 데이터 분석 프로그램을 개발한 바 있다. 개인적으로는 파이썬의 매력에 푹 빠져 되도록이면 파이썬으로 코딩하기를 즐겨하고 있다.

그 일환으로 요즘은 Django를 활용한 웹 프로그래밍, Django Rest Framework를 활용한 JSON 연동, Pandas를 활용한 데이터 분석, Scikit-learn/Tensorflow/ChatGPT 를 활용한 AI 솔루션 개발 등의 프로젝트를 개발하면서 파이썬의 활용도를 넓혀가고 있다.

< 저서 >

1. Django 로  배우는 파이썬 웹 프로그래밍 (초판, 한빛미디어, 2015.4월)
2. Django 를 활용한 파이썬 웹 프로그래밍 - 실전편 (초판, 한빛미디어, 2016. 7월)
3. Django 로  배우는 파이썬 웹 프로그래밍 (개정판, 한빛미디어, 2018. 8월)
4. Django 를 활용한 파이썬 웹 프로그래밍 - 실전편 (개정판, 한빛미디어, 2019. 11월)
5. Django 로  배우는 파이썬 웹 프로그래밍 (3판, 한빛미디어, 2022. 11월)

 

< 동영상 강의 >

1. Vue.js - Django 연동 웹 프로그래밍 (인프런 동영상, 2019.4월)
2. Vue.js - Django 연동 웹 프로그래밍 - 실전편 (인프런 동영상, 2020.9월)
3. Vue - Django - Bootstrap 뚝딱 블로그 (인프런 동영상, 2021. 9월)
4. Django REST framework 핵심사항 (인프런 동영상, 2022.2월)
5. AI Web Programming (인프런 동영상, 2024.2월)

Chương trình giảng dạy

Tất cả

50 bài giảng ∙ (5giờ 44phút)

Tài liệu khóa học:

Tài liệu bài giảng
Ngày đăng: 
Cập nhật lần cuối: 

Đánh giá

Tất cả

12 đánh giá

4.8

12 đánh giá

  • dcloyal1님의 프로필 이미지
    dcloyal1

    Đánh giá 30

    Đánh giá trung bình 5.0

    5

    100% đã tham gia

    • 때구니님의 프로필 이미지
      때구니

      Đánh giá 25

      Đánh giá trung bình 5.0

      5

      100% đã tham gia

      부트스트랩과 장고템플릿과 VUE.JS를 어떻게 효율적으로 사용하는 지 확인할 수 있는 좋은 강의였습니다. 감사합니다.

      • mo app님의 프로필 이미지
        mo app

        Đánh giá 14

        Đánh giá trung bình 5.0

        5

        96% đã tham gia

        django와 vuejs를 연동 개발하려면 꼭 봐야하는 강의입니다. 완성도 높은 개발예제와 강의로 많은것을 배울 수 있습니다.

        • 호타물님의 프로필 이미지
          호타물

          Đánh giá 1

          Đánh giá trung bình 5.0

          5

          100% đã tham gia

          좋은 강의 입니다. 클래스형뷰(CBV)에 대해 많이 배웠습니다. 나중에 DRF를 이용할 때 많은 도움이 될 것 같습니다.

          • 이현호님의 프로필 이미지
            이현호

            Đánh giá 1

            Đánh giá trung bình 5.0

            5

            100% đã tham gia

            좋은 강의 감사합니다.

            716.659 ₫

            Khóa học khác của bestdjango

            Hãy khám phá các khóa học khác của giảng viên!

            Khóa học tương tự

            Khám phá các khóa học khác trong cùng lĩnh vực!