Consume 3rd Party API (News API) In Django and Build News App With Search Functionality Very Easily😉

hello everyone welcome to my channel so i have an amazing video for you guys and as you can see it's a news api django project so i have used a news api which bursts all the information like the news image its author name the news title the news description and the source from which the information coming from and the published ad and if you click on see news and in the new tab you will see the detail of that particular news okay any any other news like this one suppose and you can go to the detail of that news and see what is happening so this is just a simple news api that i parsed information from and get all the news information in a card view as you can see and we have a button so very simple layout and you can do it very simply and easily in django and i tried like many thing like if you uh search it by category health if you click on health it will get all the information based on health related and those information should be so as you can see it is coming all the information in the nice cut view so in this project this is very important how you can work with request module in python and in django and how you can parse all the information from the third party api so if you want to learn how to indicate any information using third party api uh like youtube api news api weather api and any other api that you like or google maps api then you must have to watch this video because in this video i talked briefly how you can parse any api any third party api web services that you want to use that connects with the database and you get all the information uh in your django project you can search it by country like us if you search by country us it will get all the information from the us if you search it by india okay uh it will search all the information based on the india okay the times of india as you can see the sources the times of india so you can get all of those thing if you search it like cn okay if you search it like cn it will get all the information from china okay as you can see it is getting all the information from china and you can also search it by uh by all the category like health you can search it it will pass all the information based on that your search so this is a very simple news api jenga project and i also created all the category here so that you don't have to search it is all the category that that you want you to parse information just go to news api you can go to the this this thing the documentation news apis okay so click on this and when you click on this get api key you will get a response like this and your api key should be like this as you can see this is your api key suppose when you log in when you log in and as you can see if you click on api key you will get a particular api key for your project this is very important but for that you need to have an account as you can see i have account on this gmail and all the things okay so you must have to register on that page on the news api so that you can get this particular apis so when you get that particular api you will get all the response like this first we have the json we have the status now the total result we have and then we have a article object and article object has a multiple objects inside of an article okay so as you can see this is an array inside of inside articles we have a source and source of other object attribute like its id source is object because it has its own attribute like id name all of those thing and and the articles as you can see article have authors the person who is writing that article it has this title it has a description it has this url as you can see if you click on this url it will go that particular link of that news if you go to the url to image if you click on this it will get that particular image as you can see on the publish date and the content and all of those things are there and for each or each object we have the each article we have source okay and it has author title or everything it has everything that you need you can parse all those information very simply and easily so let me go to my api so let me search news api raw so first when you go to your particular api and your api key register on this news api you will get that particular api key so if you see the url it is newsapi.org top headlines and it is querying the information by its country and its country should be india and it it can be u.s it could it can be india it can be bangladesh it can be pakistan it can be any china it can be anything okay so based on that country it is searching all the getting all the information and also you need an api key that you will get after you register your news api documents api this website okay so this will get this kind of response and if you click on this first as you can see you have all the status uh we have the main array okay we have three items and each object as you can see if we just shrink the article if you click on this article as you can see we have all the information and this part is one object and this part is another object so in article we have an array of objects this is another object this is another object this is another object okay so this is all the objects that you see and each of the article object we have a search object and in the article we also have author title description this is very easy we will do article dot author we get the author article the title we get the title but for the source you need to write article the source dot name all of those things so those are the things that is very important to get so this is the main url that we're gonna use to create our own api okay so i'm using for the india let me create in the django project youtube for you guys i'm gonna create a new open git bash and here in the django project youtube i'm gonna create a new project which is django admin start project its name should be news app okay don't worry i'll give all the code in the description let me go there as you can see we have our news app so let me open it in code this is okay and i will give you all the source code in the description when i upload that to the github so don't worry about it go to your terminal and as you can see we have the news app so inside a news app i'm gonna create another application okay so and every project should have an app minimum which is python manage.py start app and its app should be news api okay news api okay so this is our news app is our main project and news api is our main api app okay so we need to go to the news api and go to apps and as you can see this class name is news api config and our main app's name is news api so we need to go to our project which is news app and setting we need to import that thing it should be news api dot apps dot that thing news api config okay that we get from this news api apps dot py file this is our app name news underscore api and our configuration name is news config so if you go to this place as you can see so after you save that thing okay so now you which is news api and make it you make a urls.py file okay we will need it later just create it newer dot peer file and here in the news app which is our main project url we need to connect it okay okay so this is very important so make sure that this is okay okay and this url this url as you can see from the news api app is our app level url file and this url is our main project level url file later we're gonna connect this thing so here in the views.profile i'm gonna do api request from this news api as you can see here okay so that we can work with and the news api have all the documentation like you get started you have your all the documentation like sources we have endpoint sources as you can see we have we can get all the information by us category like general health sciences sports technology and we have based on language like english spanish all of the thing and the country this is all the country then you can use and api key is the main thing that you want okay then you need a search by category or search by country i'm gonna build all those functionality as well so in this views.poi i'm gonna install pip install request pip install request to get all the requests from the particular api so as you can see the requirement already satisfied i installed this request package of the django so i don't need to install that for that for you it might be needed okay so i'm gonna clear it out and i'm gonna use so now i'm gonna import the request import request this is the library or the module that you're gonna use to get all the information from that particular api i'm gonna create a function which is dev home it will take a request okay and it will pass information from this url okay so url should be f string and then we're gonna give our particular url so this is the url that we want okay so put this url okay and this is the country and this is the thing okay so we can parcel the information based on this country okay so let me do it here yes no it's perfect alone let me do this let me delete this thing and add an api key okay it should be an api key i'm gonna paste it here api keys this one okay so this is the thing make sure yes you just need this so that's why your api key is saved you you don't need to show it in here so this is the same thing as this api key and then what you're gonna do is requests this library request dot get you will get that information from that url you can get the response response is equal to request.get and then we get the data which is response dot json we get all the response first request dot get from that particular url okay and then we can you just name variable data that will have all the information that we coming from response as you can see this variable response.json you can convert this into json format okay so that you get all the information here as a json okay as a json so for that you need it converted into response into json be careful this is very important okay so now if we print this suppose i want to print the data in the data it will give us all the information but so let me create us.py file okay let me copy all of those thing and go to app level url pfl and paste it here so we don't need admin we don't need admin here because this is applicable and just delete this it should be from dot import views and importing all the views function as you can see this home function in the url.py file and in the root directory i'm gonna use views dot home when i go to the home function okay home function it will parse the information in this path root path and give it a dynamic name it should be home okay this is very important and then we're going to set this link this applicable url.pi file link to the project level this is the project level used to appear prefer and here i need to import include and just copy this thing and paste it here and in the root directory i want to show the include it should be news underscore api dot urls this is our app name which is news api okay now i'm going to create a template here just go to the app and new folder it should be templates and it should have a name which is news api and it should have a template okay new file it should be home dot html in the home.html create a layout and it should be news app okay news app so here we'll show all the information let me create news app okay it is news app and let me pass the information in the context we need a context to pass the information and it should be data data okay the information to the data and then we need a render function return render it will take request and it will go to the news underscore api folder and it will go to the home dot html page and it will pass the context so what it does it will pass all the information from this url and as a response dot get url and we convert the information into json format and save it into data and we're going to print all the data okay and parse this data context there and return this news api context so here i'm gonna put the suppose here in the template string i'm gonna import that all those show all this data that we passed from here information in this particular page news api this is our news api folder and home.html will show all this information okay and let me run that and python manage dot py run server okay so if you run that thing okay so what is what is important that you need to use app stream so click f here and you can you can add dynamic values like in the second bracket you're gonna use api key that do you have set here so this is very important so remember you do it perfectly so now if you go to our news app and refresh it as you can see you get a chunk of like api information okay so this is not good looking in the views function it is printing all this data in the console as well and i'm showing all this information here as well so this is not good we need to first something for that what you need to do you just remove those data and this data has information like if you go that uh api as you can see we have in the article first we need to go to this particular article okay so we get all the articles so how can we go there so it should be articles and articles should be data in data we have articles okay in data we have articles we can get status and total result we first we need to get the article because article have all those things like source author title we will pre-image publish all those information so first we need to get to that article first okay now if we print that article suppose i'm gonna copy here and paste it here listed here now i'm gonna show the all the article in the home page and it should be articles so let me run that again and this is our app as you can see this it is giving like an area of object like his source author his name as you can see url to image everything we get and this is coming from this article object okay article object so this is working fine and the article we have all the information that you want so now from the views function i'm gonna show all the information as a context pass context to here so this is how you write for i in articles okay for i in articles and then to write n for in the for loop because in article we have a lot of information we have a lot of information so we need to pass each and every news for that we need a for loop and show all the information here and i want article dot author okay and in this second paragraph i need like article dot uh title and which author and title i'm getting as you can see we have we have this author that i'm gonna show and title description url and url to image so all of this information we need so this name should be the same like author title this should be the same as this so because it is person each article and in each article we have this information so art author title and what we need now we need a description and url and in the p tag we want i dot description and first we need an image which is this image stack and this image stack should be i dot url to image let me see it is perfect or not we need this thing so it is showing url to image okay perfect and give it a height of 200 pixel and width of 200 pixels okay and show the information and then we need a button and an anchor tag that will show the information when you click on this it will go to that particular news which is i dot uh you can go to this url as you can see you go there i dot url so this should be target underscore blank so when you click on this link it will go to that news go full news okay it will go to that full news when you click on that and it will open in a new tab that's why i write target is equals to unrisk or blank so let me parse all this information so we have title author description url evolved image and many url and let me add a small tag which is published at it should be published at okay published ad should be like i dot and paste it here published at so let me see if it is working or not and will show all the information you know under a for loop and in the news app and it will show first pass all the information from this country okay india an api key is that particular api key it will getting all the information as a response dot json and here we have all the data but i want only the article so that's why i write in the third record in the indexing i have only needed the article so they'll show all the information in this article variable and pass the context to that home.html page and showing all this information in a you know all those html tags so let me refresh this and see how it's working as you can see it's working perfectly we have the image we have the name art author and the title and the everything that we want and we also have a published ad as you can see we have a published ad go to full news if you go to the full news it will show us all the full news okay as you can see so everything is working fine if you go to that particular full news it is going there everything is working very well so what you need to do now is design that perfectly so that it works for you so you have to go to bootstrap and get it started i need to use the css and just paste it here the css is added then what you need to do just write everything in a div div which is class of container okay now you need to take another div and this should be raw and then we need a div of class call md six okay and then we need another div which is class call md six half of the place it will take and we will search all the information by category here okay we will show a category like this page this page okay and here we'll show all the information in a card view so for that we need to go to bootstrap and go to the component and go to card let me copy the first thing we need a title description image and go somewhere so you can copy this thing and place inside here inside a row okay we have two columns this is another column this is another column so in the first column i'm gonna show this information so now i'm gonna use the same for loop here and let me write it okay this thing okay and then we need infor let me copy this thing and paste here this is the call here let's paste it here instead of for loop okay you're gonna showing the information like in the source i should use this thing i dot url dot url to image okay and it's it should be 20 25 ram width because each card has this width and it should be rounded okay and it should be rounded and it should have a shadow lg okay and give it a margin of 2 so that it looks better then we have a div class in the h5 which is title and this title should be this let me add title should be i dot title which is the news title and let me copy this thing paste it here make it a bag of tag first i want the author okay then we title then we want some description it should be either description let me paste it here okay and then we have this thing a link so this link should be i dot url okay then we also need a small tag and i will show the information i dot published at okay published at so we have author title description and after that this after the title i want to show something go to that thing your card text i want to show the source okay so how can we get the source it should be inside article you need to go to the source and then name okay so first we go to the article i have the all the article dot author all those thing so for that i need to go to article and source dot name so i'm going to the article first then we're gonna go to the inside we have the source and inside of source we have the name so article first i have the article that it says you have a source and it has its name and make sure it is also a title class of title so that it looks a bold little bit bold so title should be nice it is working perfectly and instead of p tag okay description is a p tag and this class is called text and then we have a published ad let me add hr publish that and you can go to give it a uh let me give it a margin one and if you click on this go use see full news see news it will go to that and it's a pattern let me edit success okay button circle this is just a simple boot step class if you know little simple about bootstrap you will get all the information so this is nothing fancy now we can delete all those things okay so let me check if it is working or not we want uh author title source name description and you can get publish that and see news and you can get all of those things url to image that we're gonna see as you can see and you can get the content if you want but i'm not going to see it here okay it's working for iron articles will get all the information and this is the input and this div is for this div okay this is the each column then this is another column so we're gonna get all the information from this country india and we have the api key and if we refresh this as you can see we have a nice very nice we have this horizontal rule and the date and the seniors let me add a simple date here okay so okay uplift it and refresh it okay so we have the date that is published and seen if you click on the c news it will go to this page okay so we need to add one more thing which is target underscore blank okay very simple if you click on this if you click on seniors as you can see it is not going inside the news it is going another tab and it's showing all the information like this is the author who is written and this is the particular image that we want and this is the title and this is the source name okay this is very important the source name which we get the information from and this is the description and this is the date and the news and this particular image so we're getting all the image from this brownie to have a search functionality that based on which country you're gonna search so you need to create a simple thing like search by country and search by and here gonna in the easter tag okay in the class this should be text center so let me center it out and it should be searched by a country okay you should search by country as you can see our app heading and search by country so if you go to the documentation and if you go to the sources you can get all the information like country b e b g and great britain you can get all of this information okay so what you need to do you go to views.ui file and create something like country is equals to like us if you give country is equal to us if you go to app it will get all the information from the us okay so based on your country okay we can get all this information so that's why it is saying based on your country you can get your particular information so for that i need to create a simple search field to form to some search it by country okay so i added a form its method should be get method each method should be get because we get all the information based on the particular country name and it has an input input type text and it should have a name so that we can get the particular information it should be country okay as you can see in the views dot py we are parsing all this information this is the get request by its country is equals to something okay so we need to get that particular country name that we want to search for then we need a button and pattern has a type of submit search okay should be search and it should have a value of search so we need that and the button type should be submit and it will submit the information and its input type is text and its name is country because by country we get that particular information from that form and this method should be get and we need two thing copy and paste it here and we will search by category later we're gonna create this thing as well okay so at this moment we don't need it just you can remove this we need to get that country country is equals to request dot get it should be this get requested get by country let me write it perfectly it should be this country we getting we are getting that query string of this country because in the api we have all this country and the value we need is coming from this form the particular information that we put here as a country okay so this country should be coming all the information from this page that we wrote the particular country name it will come into this request to get that kit that particular container will get and save it to a country variable and then we're going to show information here the country is equals to that particular country that we wrote on that form so that's why you need that equal to get that gate best country and search by this country okay this is so this is a dynamic thing so it will work by that particular country so let me see if it is working or not so first you need to give it a country like search by us and it's giving us information if you click on india i n is giving indian information and it has all the thing like if you use bg which is uh be jp okay so it's dynamic you can search by country so what if this url is not like that so now i want to purse the information for uh as a category so how can you do that okay we need to go there and create a form okay let me add it here this should be br tag br tag okay and this is search by category search by category and it should be name should be different which is category we'll search by this category and each method should be getting in button is a submit okay everything will be same so we need also need to get the category category is equals to copy this thing paste it here this should be category and this should be category okay find this category now to write in logic if if country then we only give the indentation okay okay so this is working fine we have a country we have category else else it should be the url should be different then the url should be category is equals to category this category that we should put information in this field like when you go in the category field we put some information like category should be science health business all of those thing and if we get the category in the documentation as you can see we have the all this information like business entertainment general health science and the parts information by category so in the api if you add like country category is equals to science and request for this as you can see we get a different kind of api by the search of category is equals to something so this is the same thing we parse the information by category and the previous we did it for country and the second one for category we will search something by category and the category that we wrote okay to get that particular information for us suppose if you are searching by country it will give you also information by country if you search by you have two fields here and the one is for country one is for category so if you search it by category you'll show all the information by category okay so let me see it if it is working or not okay we have the search by country and let me see if it is working like india let me search it and yes it is working perfectly if you click on like health okay it is giving us all the health information so it is working perfectly now you have all of these things like category so now on to see the information in a category wise format so for that we need to go to the ul tag we have ally so in the ul in the bootstrap we have a class of list group ally we have a list group item okay so this group item we have the a tag and it should be in the href it should go to that dynamic url it will go to the home and first information by category is equals to health okay and its name should be health okay so let me see this or if it is working add one more ally tag and this is for science let me add it for science it will go to the home url root url slash as and query by is category is equals to health and anotherness category is equals to country okay so this is the two important thing run this thing again as you can see we have two category health and science and let me add a class to this which is btn btn primary and let me add the same class there okay refresh it yes we have science health science if you click on signs and it is giving all the information based on signs if you click on health it is giving different information so all of this information is coming properly you can copy all of this thing i already wrote something as you can see we have all the thing the list group i can copy all of this thing and okay so this is let me make it button secondary and this should be success and entertainment should be danger sports is secondary so these are all the bootstrap class primary again and business is info all of this thing if you paste it here and as you can see we can pursue the information like technology health entertainment sports as you can see we have all these sports news science news business as you can see our main uh our url this is the root url then we is going to the category and based on that category 2 is giving us that information okay and this is all the category-wise and you can do it for same for country-wise and for the country was you can add it like this way home slash country is equals to uh country is equals to u.s suppose and it will show us us info okay so if we click on this uh if you click on us info the url should be country is equals to it will go to the root url and it will go the country is equals to us okay very important so as you can see all the information that you work like if you search by us by country or any other country it is giving us all the information in the nice looking shape as you can see in the nice cut view okay it's working perfectly fine and you can add all those padding margin okay if your category for health if you search it as you can see it's working very fine pretty it should be inside the bolt tag okay let me copy and paste it and okay give it a pr tag and paste it here so it will it looks a little bit good we need a hr horizontal rule and then we have a list of link okay six let me see called md eight this is called mda this is four okay okay so category goes a little bit on the right side and go to technology okay it is giving us very nice information so these are the things that i want to show you how can you can consume in any third party api in django project and make your own applications and any other microservices that you want okay so thanks for watching i'll be coming with a lot of amazing content so till then take care bye

Channel: Great Adib

Views: 3,178

Rating: 4.8769231 out of 5

Keywords: consume api in django, 3rd party api consume python, how to make newsapp, make newsapp in django, work with api json response in django, how to get information in from api to django app, learn to build app by consuming api, news api based project, django news app project

Id: 1xb7nkgQ75U

Length: 40min 53sec (2453 seconds)

Published: Sun Apr 04 2021