Using AI tools to build a React.js application - Part 1

In this post I am going to leverage some AI tools available to help build an application. Let's start by asking ChatGPT to help us creating a twitter-clone app and use tailwind css. I gave the following input and this is the output I received:

After following the steps given by ChatGPT and now start the server.

npm start

and here is the screenshot for the app that starts in the browser:

So lets start by adding some steps that we are going todo later on:

      <h1>Things to do</h1>
      <ul>
        <li>Create a mock up of the UI you want</li>
        <li>Make react components out of them</li>
        <li>Use AI tools to build</li>
      </ul>

and here is how it looks after adding the things that we are going to do.

next step, is I would like to ask Github Inline Copilot to add in some classes to the header and list items and accept the changes provided by Copilot.

The changes to the pages looks like this

This is not exactly the perfect looking application but still not bad if you can get this started.