Textutils Website using DJANGO

Radhika Agrawal
funccFORCE
Published in
4 min readApr 12, 2021

Step 1: Open Pycharm IDE and start a new project named “textutils.” As we are going to make the Textutils website so I preferred this name.

Step 2: Open the built-in terminal of Pycharm.

Step 3: Type the below command to start the project and press enter:

django-admin startproject textutils

Creating views.py:

Now, create a file called views.py inside the textutils folder (The folder which we created for us by Django)

Steps to start the Django development server :

Step 1: Now, Go into the directory containing the manage.py file

Step 2: Open the terminal and type the command: python manage.py runserver

Step 3: Head over to http://127.0.0.1:8000/, you will be seeing a congratulations page.

Building urls.py :

First of all, I need to import views in our urls.py file.

Code for urls.py file:

FIG:1

What is the path function?

• Within the Django.urls module, Path functions are contained.

• It helps in routing URLs to the correct view function in a Django project.

For example :

* contact/: It is the endpoint of the URL.

* views.contact: This function is defined in the views.py file. Here, we are passing the function to be executed whenever someone accesses the ‘contact’ page of our website.

Creating functions in views.py:

FIG:2
FIG: 3
FIG: 4

• First of all, I imported the HttpResponse object from django.http module.

• Whenever a user requests a page, Django creates an HttpRequest object that contains the metadata of the request. After creating an HttpRequest object, Django passes this object inside the view function as the first argument. Hence, a specific HttpResponse is generated for each view function.

• Further, I made analyze the function and wrote code for Remove Punctuation, Full Capitalization, Extra space remover, and Newline.

• First function, I made is the index function which has an index.html file.

• Next function is the Contact function, in which I passed my Linkedin profile link as a link.

• Another function is about function, which has an HTML file named about.html.

For, formatting of HTML files, I used Bootstrap.

If you don’t know about Bootstrap, here is a small introduction to that :

Bootstrap is a free and open-source tool collection by which we can make responsive websites and web applications. It is the most popular HTML, JavaScript, and CSS framework used for developing responsive, mobile-first websites. It helps in solving many problems which we had once, one of which is the cross-browser compatibility issue.

Please do refer https://getbootstrap.com/docs/4.0/getting-started/introduction/ for Bootstrap.

Now, for the description of HTML files, let me show you the output of my project:

For that, I have to go on the terminal of my Project and type — python manage.py runserver.

FIG: 5 Home Page

This is the result I got on the “home” page as its coding is done in the index.html file.

Navbar and buttons, I have taken from bootstrap.

FIG: 6 Contact Page

Now, this is what I got when I went to the “contact” page…which simply showed me my LinkedIn profile and some text which I printed in the contact function in the views.py file.

FIG: 7 about page

This is the “about” page in which I have used the same Navbar. I have used the same Navbar in all the HTML files. I have typed the above-displayed text in the HTML file.

FIG: 8 Home page

Now, I entered a random text, that is “Hello everyone…hope you enjoyed it,,,;;;” with and enabled two buttons named ‘Remove Punctuation’ and ‘UPPERCASE’ and clicked on ‘analyze text’ button as I want to filter my text.

FIG: 9 Output on analyze page

The result I got on analyze page is the same which I expected.

Hence, I succeeded in making a successful textutils website.

Note: I have not described Bootstrapping and coding here. If having any doubt then feel free to ask me about the same in the comments. I hope you enjoyed it.

--

--