Build & Deploy Google Search Application with React JS & Tailwind CSS | Google Clone in React

In this video we will be creating a fully functional & fully responsive google clone single page application with react js, tailwind css & Google Custom Search API, we will use core concepts of react js such as jsx, components, props, state, lifecycle of components, conditional rendering, lists, keys & context api, we will build more complex logics in javascript to make our react application super interactive and good looking and most importantly, you'll learn how to fetch data from Google Custom Search API.

Recommended Videos:

📚 Materials/References:

Installed NPM Packages:

Tailwind CSS:

🔥 In this tutorial you’ll learn :
- React 18 and its latest features
- React functional components and their reusability
- React hooks and state management
- React routing
- How to use Context API
- Mobile first responsive approach
- Fetching data from Google custom search API
- How to use Axios in react app

Follow me on 👇

👇 Time Stamps
00:00:00 Intro
00:01:18 Demo
00:03:02 Project Setup
00:08:14 React Router
00:12:20 Home
00:23:42 Home Header
00:30:41 Compose Bar
00:30:41 Search
00:43:25 Footer
00:43:25 Footer
00:51:37 Compose Bar Functionality
00:58:53 Search Result
01:15:33 Context API
01:23:50 API Integration & Axios
01:36:41 Search Result Listing
01:56:40 Pagination
02:13:23 Deployment

[akshayasalaskar]

Thank you so much bhaiya!!!! Because of you I made my first web application 🙌🙌🙌 May Shiva bless you with loads and loads of Happiness, Success and Health🙌.

[SujalSonavane]

I am really becoming your fan brother, the way of style of your teaching is so simple and understanding even if someone don't know any concept

[AnuragMishra-wszc]

Sir you are great 👍. Completed this project.

[vinitapatanker]

Your tutorial is the Thanks for the tutorial sir😇

[gulnazbano]

Your tutorial is the Thanks for the tutorial sir

[gama]

this is really geniune tutorial ..
i love this tutorial ....
plzz upload some more tutorial like this..😊

[yashpaota]

Thanks brother for this project, Learned some new things understood them still need to work to attain hand-on experience.
💪💪

[thewebdesigner]

Brother very nice thank you shareing knowledge..easy to understand all concepts..I have done complete project step-by-step and aslo deploy on netifly... please upload more project as soon as possible..

[ijaz_]

Love this tutorial Thanks. Please Build a Blog CRUD App with MySQL.

[once-upon-a-time-]

thank you for the video i learned a lot from this video.

[LATESTNEWS]

bro ap achha stdy karate ho plzz full react course pe video banavo zero se hero

[Worldfood]

Broo can make all time your biggest project of programming journey because I need a project for my finals project and I have only 20 day can make a video 😢❤

[codewithjaffar]

great work bro, we need e-commerce project with admin, app should be on strapi and react, material UI

[code_with_meee]

getting api error status of 429 too many requets what should i do

[gulnazbano]

Please help to loade the data in console my api data is not loaded

[AmithBV-cs]

How is that you haven’t got CORS error? I got one and I’m not able to solve it…..

[abuhuraira]

I have a question
We can search everyone on it
Like Dollar rate
Will it give us updated results

[shahhussain]

Bro mera pagination work nahi kar rha hai, koi error bhi nahi aarhi hai active page change horhe hai but result same hi reh rha hai.. please ap kuch bata sakte hai.

[prakharbuliya]

Brother I am getting error in Images section. Cross Origin Read Blocking, and Axios Error. Please help

[abuhuraira]

Kindly Inform me
Is it good for the final year project