Building Dynamic Web Application with

Django: Industrial Training Project

z
Name – Samrat Singh

Batch – III year CS

College – Shankra College of Engineering

Date – 05/12/2023
z
Training Overview

 This industrial training program lasted for 8 weeks, providing an

intensive learning experience.

 Main topics covered during the training are :

o Front-end Development
o Back-end Development
o Responsive Design

 The training program emphasized the use of HTML, CSS, JavaScript,

and Django.

 There will be an exam at the conclusion of the program that the student
must pass with a minimum score of 40% in order to receive a
certificate.
z
z
Introduction to Django

 Understanding Django's key components is crucial. Django's core

features include the Object-Relational Mapping (ORM) layer, which
simplifies database interactions, URL mapping, template system, and
authentication.

 Django provides an ORM layer that handles the translation of Python

code into SQL queries, making it easier to work with databases.
Understanding how to create and manipulate models is essential for
building dynamic and scalable web applications.
z
Project Overview

 The Project that I have built during this training is called

Network, and is inspired from the X (formerly twitter).

 This Web application allows user to login & logout using their
username and password and post their thoughts & share it with
everyone.

 It also enable user to follow or unfollow other users, also they

can like the posts shown in their feed.

 I have also added an Edit button who enables author to edit

their posts & make changes in real-time.
z
Project Demonstration
z
Technical Challenges

 The very first challenge that I faced while building this project is
that How can I allow users to toggle between the Follow and
Unfollow button or between Like and Unlike without reloading
the page completely, i.e. providing smooth UX ? This problem
was solved by writing some smart JavaScript for that page.

 The second challenge I faced in Pagination i.e. To list 5 posts

per page & provide Next/Prev buttons at the footer of page. This
issue was resolved by reading some Django documentation to
know more about page obj & pagination library.
z
Key Features of Network

 User registration and authentication :- New user can create their

account or existing users can login using their username & password.

 Posting thoughts and managing user profiles :- Users can share their
thoughts with other users by posting them. Profile of each user is
maintained i.e. their liked posts, no. of followers & following.

 Like functionality for thoughts :- A user can also like another user's post
by clicking on heart button.

 User following and follower system :- Each user has a separate account
with their followers & related posts is shown at Following tab.
z
Project Enhancements

 I have added an functionality of editing the post which allow user

to edit their posts in real-time to provide fluid user experience.

 This functionality is only given to the author of the post, so that

other user can not edit their posts.

 This is very useful feature as there can be some typing mistake

by user while posting it or thoughts of user can be changed after
posting it.
 z
Key Learnings
 HTML, CSS, and JavaScript form the fundamental trio of web development. HTML
provides the structure of web pages, CSS handles the visual styling, and
JavaScript adds interactivity and dynamic functionalities. By learning about them, I
was able to develop the front-end of a website.

 Django is a high-level Python web framework that simplifies the process of

building web applications. It follows the MVC architectural pattern, allowing for
modular and scalable development. I gained an understanding of how things work
at the backend through learning about Django.

 By combining HTML, CSS, JavaScript, and Django, developers can create robust
and feature-rich web applications. They can design appealing user interfaces,
handle user interactions, interact with databases, and implement complex
business logic, resulting in interactive web applications.
z
References/Resources

 Django Documentation : https://docs.djangoproject.com/en/4.2/

 Django Community : https://dev.to/t/django

 HTML/CSS :
https://developer.mozilla.org/en-US/docs/Web/CSS/Reference

 JavaScript : https://www.w3schools.com/js/
https://developer.mozilla.org/en-US/docs/Web/JavaScript
z
Contact Information
z

Thank You for your attention!