Make a News app with NewsApi

Nilay Paul
2 min readFeb 17, 2021


Let’s make a news app with Django and newsapi .

Step1 : Create a new Django project

django-admin startproject "project name"

Step 2: Create a new Django App

django-admin startapp "app name"

Step 3 :

Go to and create an account . After this grab the api key . -> Top headlines -> Copy the url (looks like this )"Your api key"

Step 4 :

Go to and write this code

from django.shortcuts import renderimport requestsimport json# Create your views here.def home_view(request):url = ""response = requests.get(url)content_from_internet = json.loads(response.content)context={'data':content_from_internet,}return render(request,'index.html',context)

Step 5:

Go to of the main project and write

"""News URL ConfigurationThe `urlpatterns` list routes URLs to views. For more information please see: views1. Add an import:  from my_app import views2. Add a URL to urlpatterns:  path('', views.home, name='home')Class-based views1. Add an import:  from other_app.views import Home2. Add a URL to urlpatterns:  path('', Home.as_view(), name='home')Including another URLconf1. Import the include() function: from django.urls import include, path2. Add a URL to urlpatterns:  path('blog/', include('blog.urls'))"""from django.contrib import adminfrom django.urls import path , includeurlpatterns = [path('admin/',,path('',include('mynews.urls'))]

Step 6:

Create file inside the app and write..

from django.urls import path , includefrom .views import home_viewurlpatterns = [path('',home_view,name='home'),]

Step7 : Go to index.html and write ..

<!doctype html><html lang="en"><head><!-- Required meta tags --><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><!-- Bootstrap CSS --><link href="" rel="stylesheet" integrity="sha384-BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl" crossorigin="anonymous"><title>News APP</title></head><body><div class="container"><div class="row">{% for onedata in data.articles %}<div class="col-sm"><div class="card " style="width: 18rem;"><img src="{{onedata.urlToImage}}" class="card-img-top" alt="{{}}"><div class="card-body "><h5 class="card-title ">{{onedata.title}}</h5><p class="card-text">{{onedata.description|truncatechars:150}}</p><a href="{{onedata.url}}" target="blank" class="btn btn-primary">Read</a></div></div></div>{% endfor %}</div></div><script src="" integrity="sha384-b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0" crossorigin="anonymous"></script></body></html>
The file structure looks like this

Now just start the server .

Final website

Do you want to see any specific blog ?

If so you can hit me up on “” . I like to post about Django , Python and Unity stuff .

Currently working on a multiplayer game with unity and machine learning with Django . If you are interested in them then you can follow my medium page .