How I am catching up with AI
Tags: ai, devjournal, webdev
Published: 2023-05-18 23:55:02

## 🌐 AI: The Game Changer 

The world has seen an overwhelming surge in artificial intelligence (AI) advancements in recent months. AI refers to the development of machines or computer systems capable of performing tasks that usually require human intelligence. 

A few notable examples of these leaps in AI technology include [GPT-3.5](https://platform.openai.com/docs/models/gpt-3-5), [GPT-4](https://platform.openai.com/docs/models/gpt-4), [ChatGPT](https://openai.com/blog/chatgpt), [Midjourney](https://www.midjourney.com/), [Dall-e 2](https://platform.openai.com/docs/models/dall-e), [AutoGPT](https://github.com/Torantulino/Auto-GPT), and [Github Next](https://githubnext.com/). 

These innovations have brought significant changes to various industries, from healthcare and finance to entertainment and education.

---


## 🤝 My Journey with AI: Copilot and ChatGPT 

My journey with AI began almost a year ago when I started using Github Copilot, an AI-powered code completion tool that significantly changed my daily work life. 

I'm also using ChatGPT, an AI language model, in nearly every aspect of my life, from drafting emails to brainstorming ideas. 

Copilot and ChatGPT have boosted my productivity by at least 3x, allowing me to accomplish tasks more efficiently and effectively than ever before.

---


## 📰 Staying Informed: Newsletters and Twitter 

It's challenging to stay abreast of the latest news in the AI world, but this isn't the first time I've felt this way. 

I experienced similar feelings with blockchain and smart contracts. However, AI is different: it's not a niche technology; it's here to change everything. 

To stay informed about the latest AI trends, I rely on Twitter and newsletters.

Here's what I would recommend following/subscribing:

### Twitter profiles:

* [@heyBarsee](https://twitter.com/heyBarsee) 
A guy that tweets some cool AI tools

{% tweet 1646161786981187585 %}

* [@mckaywrigley](https://twitter.com/mckaywrigley)
A guy that is building an AGI that builds web apps

{% tweet 1646596881420783619 %}

* [@TheRundownAI](https://twitter.com/TheRundownAI)
An AI newsletter on Twitter with the latest news on AI developments

{% tweet 
 1645782520040939520 %}

### Newsletters:

- [AI Valley](https://www.theaivalley.com/): Prompts, tools and updates about AI
- [The Prompt Report](https://thepromptreport.com): Weekly reports with useful prompts and prompt engineering tips and tricks
- [Superpower ChatGPT](https://chrome.google.com/webstore/detail/superpower-chatgpt/amhmeenmapldpjdedekalnfifgnpfnkc): A daily AI newsletter inside a Chrome extension that adds a lot of features on top of the ChatGPT UI

---


## 💡 Applying AI to Real-life Problems 

I'm always eager to apply the newest AI advancements in practical ways. Here are some of the things I tried:

### 🔸 Automation Scripts

The combo ChatGPT + Github Copilot is excellent for creating scripts that facilitate mundane tasks.

* A script that **automates the creation of GitHub pull requests** for Jira issues, extracting the Jira ID and issue title from the branch name, and setting the appropriate label and target branch.

![PR Script](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5sm65cz7maha33i6296l.png)

* A script that **creates a new React component** file with a given name and writes a basic functional component template with Tailwind CSS utility support inside a "components" directory.

```bash
#!/bin/bash

# Prompt user for the component name
echo "Enter the name of the React component in:"
read component_name
capitalized_name=$(perl -pe 's/^./\U$&/' <<< $component_name)

# Create the components directory if it doesn't already exist
if [ ! -d "components" ]; then
  mkdir components
fi

# Create the component file
touch "components/$component_name.js"
echo "import { twMerge } from 'tailwind-merge'

export function $capitalized_name({ className = '' }) {
  return (
    <div className={twMerge('', className)}>
    
    </div>
  )
}" > "components/$component_name.js"

echo "Successfully created React component file for $component_name!"
```

* An [userscript](https://gist.github.com/Markkop/d118f3ee703a8536f8eccf720d3792ac) that adds a button to the WebMotors website, which, when clicked, fetches and **displays the FIPE price** (a Brazilian vehicle pricing reference) for each car listing on the search results page.

![WebMotors](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rjcpp5nhoyn8xkgdbuff.png)

---

### 🔸 Creating base code for components

Sometimes I try to evaluate how far we are in web development with the AI in charge. My last experiment was asking ChatGPT to create a progress bar component for me with a huge prompt.

{% embed https://dev.to/heymarkkop/creating-a-progress-bar-component-with-chatgpt-2lgj %}

---


### 🔸 Creating the foundation for a web app

I have this small side project that I always wanted to work on. It is a web app that aims to help the moderator of a werewolf/mafia party game to keep track of the players' roles and actions.

I had started it once and set everything up, but I didn't manage to keep working on it.

Luckily, when I wanted to continue the project, I had access to ChatGPT with GPT-4 and knew something about prompt engineering.

I described my entire application and added a few data structures.

{% embed https://github.com/Markkop/werewolf-moderator-helper/pull/1 %}

The result was fantastic. 
Over 20 files changed and 500+ additions. 

![Files changed](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/2oxeosau9o228468rhkh.png)

You can check the files and code on the Pull Request above.

You can also try out the ChatGPT code here:
https://werewolf-moderator-helper-9frdwh6ec-markkop.vercel.app/

Just make sure to match the number of players and roles before starting the game.

Or you can check out this GIF:

![Demo](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6r90wvhqszgaj9xulo1o.gif)

Sure, the app was not working 100% and there was a lot of stuff to implement, but having all the steps set up was a lot of effort saved.

---


### 🔸 AutoGPT 

{% embed https://github.com/Torantulino/Auto-GPT %}

Of course, I had to play with AutoGPT, the current hot topic in the AI world.  
After trying one thing or two, I asked it to help me with this blog post.
You can notice that at the very start of this article, I mentioned a few names related to AI: `GPT-3.5, GPT-4, ChatGPT, Midjourney, Dall-e 2, AutoGPT and Github Next`

I wanted to link those without the effort of having to get their links myself and format them to markdown, so I created a `LinkGPT` agent to that for me.

```yaml
ai_goals:
  - Create a links.md file
  - Search the following on google, separately = GPT-3.5, GPT-4, ChatGPT, Midjourney, Dall-e 2, AutoGPT, and Github Next
  - For each result, create a markdown link with the "body" summarized and its "href", for example = [Summarized body up to 5 words](href). Append it to the links.md file.
ai_name: LinkGPT
ai_role: an IA designed to get and save links
```

It worked to some extend, but since I didn't have access to the [GPT-4 API](https://openai.com/waitlist/gpt-4-api), the AI was pretty bad at planning and executing its tasks with only GPT-3.5.

After a few hours of trial and error tweaking the AI goals and role, I had to do that manually.
But it was an wild experience nonetheless.
Being able to run this kind of technology on my own machine was impressive.

{% tweet 1646679023517401090 %}

---


## 🎯 Pivoting to Prompt Engineering 

As AI continues to advance, I've been contemplating a career pivot to become a Prompt Engineer. I believe that some developers may eventually be replaced by AI, and those who remain will be the ones who can harness AI's power to their advantage. Prompt Engineering, a field focused on crafting high-quality prompts that guide AI systems to generate useful outputs, is emerging as a crucial skill for developers who want to stay relevant in the age of AI.

---


## 🎉 Embracing the AI Revolution: A Look Back and Forward

As we've journeyed through the world of AI together, from groundbreaking advancements like GPT-3.5 and GPT-4 to practical applications and the importance of staying informed, it's clear that AI is reshaping our lives and industries at an unprecedented pace. My personal experiences with AI tools like Copilot and ChatGPT have demonstrated the immense potential of AI in boosting productivity and transforming workflows.

The realm of AI is vast, and it's essential to continue exploring new ways to apply this technology to real-life problems. By experimenting with AI-powered automation scripts, component creation, and even kickstarting web app development, we can witness firsthand the capabilities of AI to revolutionize our work and lives.

As the future unfolds, I'm excited to pivot towards Prompt Engineering, ensuring that I remain on the cutting edge of the AI revolution. This career shift not only allows me to harness the power of AI more effectively but also prepares me for the challenges and opportunities that lie ahead in this rapidly evolving landscape.

As we continue to embrace the AI revolution, let's stay curious, informed, and adaptable, ready to seize the opportunities that AI brings to improve our lives and shape the future. 🚀


Disclosure: This blog post was partially restructured with the assistance of AI