Table of contents
Table of contents
Why I am writing this guide
Writing a New Code
Write a new program
Detailed prompt to write a new program with given technology stack
Generating Full Stack Code
Convert the code from one technology to another
API Development
API endpoint design and development
Writing customised complex APIs
API Authentication
Asking Questions
Asking programming and coding problems questions
Create a task list
Fixing errors
Fix errors with technology stack
Fix error by passing error message
Fix logical error
Fixing error in the given line
Refactoring and Improving Logic
Refactor code
Improve code logic
Database Management
Writing queries
Generating dummy data for testing
Insert dummy data
Write ORM/Models queries
Database design and creating schemas
Working with legacy code
Understand the code
Write queries for given framework or library
Code Review
Improve code quality
Write documentation
Write code with uniform coding standards
Write comments
Writing third-party library code
Write code for given library or package
1
Write a code for specific library/package version
Adding new logic to existing code
Add a new logic code in existing code
Understanding the issue with the current code
UI Development
Generate HTML Pages
Generating colour palette
Creating flex or grid layout
Improving current UI
Working with API
Display API Data
Display API Data in the existing UI
Display error and success messages from APIs
Build Components
Create email templates
​Create React components
Server Side Work
Server setup and configuration
Automating database backup
Improve server security
Ask commands to complete your tasks:
Schedule cron jobs
Interview Preparation
Understanding company requirements
Creating resume
Create resume template
Write career objective or project description
Improve career objective or project description
Interview Preparation
Get practice problem
Verify your answers
Get Interview Tips
Sending Emails
Write a mail to send resume
Give reply to recruiters mail
Sending emails to clients and boss
Write status update email
Write a requirement clarification email
Write emails for leave applications
2
Why I am writing this guide
I have 12+ years of experience in the software development field and 5+ years
of industrial experience. I thought there would be no future innovations like the
Internet or computers. But ChatGPT proved me wrong.
After 5-10 years, ChatGPT and other AI products will change the world. It will
change how people work, increase some people's work by 10X, or replace
some people's jobs.
As per my prediction, it is going to disrupt the software industry as well. It may
not replace software, but it may reduce the workforce by 50%. As of now, I am
doing 8 hours of my work in 1 hour. Just imagine how it would be after the
upcoming ChatGPT update.
Yesterday, the CEO of ChatGPT (OpenAI), Sam Altman, tweeted:
So I took a walk and thought deeply about how ChatGPT is going to disrupt
the software development market.
3
He is trying to say that in a few years, plumbers may get more money than
software developers. We can't do plumbing jobs by giving commands to the
AI. But we can code by typing plain English commands.
As of now, I have a 400K+ audience on Instagram and get thousands of page
visits on my website. So I decided to help my audience learn about AI, use it,
and work with it to compete with other people.
It's a new Internet. A new generation will grow with AI. After a few years, we
will be like our dads as they use the internet, and for us, it will be AI. So to
compete with the new generation and take advantage of AI, I decided to
create this product.
I will make incremental changes to this product as I learn more about it (you
will receive updates via email).
As I am a full-stack JavaScript developer, I am going to use JavaScript
commands for back-end development and general coding prompts.
I have written reusable prompts that you can use for any technology
stack. You just have to replace your technology according to the given
prompts.
You just need to figure out how I write prompts to get the job done. By finding
patterns and practicing them, you can create your own prompts.
I would recommend you read each prompt and example; you will need them in
your lifetime to work faster.
Note: Output may vary over time as the ChatGPT team continuously updates
its product.
4
Writing a New Code
Suppose you are working on a new project or feature, and you have to write
new code. You may reduce more than half of your development time as
follows:
Write a new program
Prompt:
Act as a [Technology Name] developer. [Write a detailed description]
Example 1:
Act as a Python developer. Write code to read and print duplicate records from
the provided CSV file.
Example 2:
Act as a JavaScript Developer, Write a program that checks the information on
a form. Name and email are required, but address and age are not.
Example 3:
Act as a JavaScript Developer, Write a program that checks if a string contains
a substring.
Detailed prompt to write a new program with given
technology stack
Prompt:
Act as: [Enter your profile]
Technology stack: [Enter your technology stack]
Functionality: [Enter functionality]
Mandatory Fields: [Enter Fields]
5
Optional fields: [Enter Fields]
Task: [Write a task description]
Example 1:
Act as: Node.js Developer
Technology stack: Node.js, Express.js, MongoDB, Mongoose
Functionality: Newsletter
Mandatory Fields: Email
Optional fields: name
Task: Make an API that takes a name and an email address as inputs and
sends back a success flag.
Example 2:
Act as: PHP Developer
Technology stack: Laravel 8, MySQL
Functionality: CAGR Calculation
Mandatory Fields: Amount and Years
Optional fields: NA
Task: Write a service that calculates CAGR
Example 3:
Act as: PHP Developer
Technology stack: Laravel 8, MySQL
Functionality: Cron
Task: Write a cron that sends portfolio returns every day to users.
6
Generating Full Stack Code
If you are a full-stack developer, you have to write HTML, CSS, and
React/Angular in the front-end and APIs and database queries in the backend.
(Or other technology stack) You can get a full code for the given functionality
using the ChatGPT as below.
Prompt:
I have to [explain your task]. Write code for the front-end and back-end with a
database query.
Front-End Technologies: [enter front-end technologies]
Back-End Technologies: [enter back-end technologies]
Example:
I have to show total weekly and monthly sales on the dashboard. Write code
for the front-end and back-end with a database query.
Front-End Technologies: HTML, CSS, Bootstrap 4 and React
Back-End Technologies: MongoDB, Mongoose, Express.js, and Node.js
Note: When the code length is long, ChatGPT 3.5 doesn't always give the
whole code. Just tell it to write it again using the incomplete code
technology React at that point.
You have not provided complete React code; write complete React code.
Convert the code from one technology to another
When you have to convert the code from one technology to another, like
Python to JavaScript, Bootstrap 2 to Bootstrap 4, CSS to Bootstrap 5, or
Tailwind to Bootstrap, At that time, ChatGPT can help you with this task.
Let’s check a few examples:
Prompt:
Convert the given [current code technology] code to [new code technology].
7
Example 1:
Convert the given Python code to JavaScript.
Code:
def multiplication_table(num):
for i in range(1, 11):
print(f"{num} x {i} = {num*i}")
Example 2:
Convert the following Bootstrap code to CSS code
Code:
<button type="button" class="btn btn-primary">Click Me</button>
API Development
Now, almost every website needs APIs for better user experiences and
services. Sometimes, building an API is a very repetitive task. API
development contains API endpoint design, creating an API, giving the right
response, etc.
ChatGPT can assist you in API development with all these tasks. Here are a
few prompts and examples that will help you with API development.
API endpoint design and development
API endpoint design is crucial. If you do it wrong, it can lead to poor
performance, an increase in maintenance costs, reduced usability, and a
frustrating developer experience. Here is the prompt that will help you with API
endpoint design.
Prompt:
Design API endpoints for me with code. It should be reusable, easily
maintainable, understandable, handle all errors, give proper responses, and
be scalable.
8
Technology Stack: [enter your technology stack here]
Functionality: [explain your functionality]
Example:
Design API endpoints for me with code. It should be reusable, easily
maintainable, understandable, handle all errors, give proper responses, and
be scalable.
Technology Stack: Node.js, Express.js, MongoDB
Functionality: commerce cart system
(This prompt output might be long, if ChatGPT gives an incomplete response
the write prompt: “Complete the response”)
Writing customised complex APIs
This prompt will help you write a complex and customised API as per your
requirements.
Prompt:
Write an API that gives a proper response with a message, logs errors, and
validates the user's required data.
Functionality: [explain the requirement in details with input and desired output]
Technologies: [enter your technology stack here]
Example:
Write an API that gives a proper response with a message, logs errors, and
validates the user's required data.
Functionality: The user will pass the period to get the sales amount. Currency
can be in INR, USD, or GBP. But return the result in INR only. The period can
be a date range, month range, or year range. Identify the pattern and write
code accordingly.
Technologies: Node.js, Express.js, Mongoose, Redis cache
9
API Authentication
APIs can be called by any platform or tool. We need to secure the API and
give access to authenticated users. To do this, you will have to write
middleware. Writing middleware is a complex task, but ChatGPT can help you
do it in a few minutes.
Prompt:
Write a middleware to authenticate using [explain how you want to
authenticate (session, JWT), authenticate (session), and what you want after
authenticating the user].
Technologies: [enter your technology stack]
Example 1:
Write a middleware to authenticate using JWT and store the access data in a
database.
Technologies: Express.js and Mongoose
Example 2:
Write a middleware to authenticate using JWT and store the access data in
the database.
Technologies: Spring boot, MySQL, Hibernate
Don’t type the same ChatGPT prompt repeatedly. Click here to build AI
tools from your ChatGPT prompt.
10
Asking Questions
Sometimes it takes us two to three hours to write a small, simple piece of
code.
With ChatGPT, you won't have to worry about working on small logics or using
Google to find functions, methods, libraries, or logic. You can do it using the
following short commands:
Asking programming and coding problems questions
Prompt:
1. How to [Question]
2. How can I [ask]?
3. Write a code that [logic].
Example 1: How do I format dates in JavaScript?
Example 2: How can I remove a given item from an array in JavaScript?
Example 3: Write a code that removes duplicate elements from an array
using Python.
code
Example 4: How to handle the null pointer exception in Java
Example 5: How to convert an InputStream into a String in Java
Example 6: Format dates in YYYY-MM-DD format using JavaScript.
Example 7: Write a Node.js program that sends an email to me when an
exception occurs.
Example 8: Write code that calculates user portfolio returns using Python
By running the new command, you can easily add new logic to
ChatGPT's output as follows:
11
Next command: In the above, skip Apple stock returns and give me an
updated code.
Create a task list
Prompt:
I have to work on [explain functionality in detail] functionality, and I am going to
use [enter your technology stack]. Divide this functionality into small tasks and
create a task list for me with an estimated time.
Example:
I have to work on monthly and weekly sales chart functionality, and I am going
to use the MERN stack. Divide this functionality into small tasks and create a
task list for me with an estimated time.
12
Fixing errors
When we get a ticket to fix a production issue, it can sometimes take days to
figure out how to fix a small problem. You can fix those issues in a few hours
with ChatGPT's assistance.
Here are the prompts that will help you fix the errors:
Fix errors with technology stack
Prompt:
Tell me how to debug the code to solve the given error.
Project: [Project name/description]
Technology Stack: [Technology Stack]
Error: [Explain the error]
Example:
Tell me how to debug the code to solve the given error.
Project: eCommerce
Technology Stack: JavaScript, Node.js, Express.js Stripe, MongoDB
Error: Orders get placed twice for Indian users.
Fix error by passing error message
Prompt: I am getting the error: [Insert your error message here]. Explain the
issue briefly and tell me how to fix it with updated code and steps.
Example: I am getting the error: Cannot get strings. key_one because
property key_one is missing in undefined [1]. [1] strings?: [string_key: string]:
string. Explain the issue briefly and tell me how to fix it with updated code and
steps.
13
Sometimes we get a logical error. We can fix the error by passing our code to
ChatGPT.
Consider the following scenario: I am calculating CAGR and getting incorrect
results. I will use ChatGPT to rectify this issue.
Fix logical error
Prompt: I am working on the [Enter functionality], but my code is giving the
wrong answer. Tell me what the error is. Here is my code. [Paste your code
here]
Example:
I am working on the CAGR calculation functionality, but my code is giving the
wrong answer. Tell me what the error is. Here is my code.
function calculateCAGR(startValue, endValue, years)
{
const cagr = (Math.pow(endValue / startValue) - 1) * 100;
return cagr.toFixed(2);
}
Fixing error in the given line
When the compiler or interpreter gives you an error on a given line, like a
missing quote or symbol or an unexpected token, you can fix it by passing the
given line code:
Prompt:
Fix the error in the given line.
Code: [paste your code]
Example:
Fix the error in the given line.
Code:
14
<button class="btn btn-sm dropdown-toggle {{($data['payment_status'] ==
'paid' ? 'btn-success' : ($data['payment_status'] == 'unpaid' ?
'btn-danger' : ($data['payment_status'] == 'failed' ? 'btn-warning' :
'btn-info'))}}" type="button" id="dropdownMenuButton"
data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> {{
ucfirst($data['payment_status']) }} </button>
Don’t type the same ChatGPT prompt repeatedly. Click here to build AI
tools from your ChatGPT prompt.
15
Refactoring and Improving Logic
Sometimes we write code that is not reusable or scalable. Using ChatGPT, we
can make our code reusable, scalable, and capable of handling all types of
data by passing our current code.
It will make you appear intelligent and prevent future errors and extra work. To
make this section easier to understand, we will work on the same CAGR
calculation function to improve the logic as shown below.
Refactor code
Prompt:
Refactor the given code.
Requirement: [Enter your requirement]
Code: [Paste your code here]
Example 1:
Refactor the given code.
Requirement: It should work for quarterly and monthly CAGR calculation also
Code:
function calculateCAGR(startValue, endValue, years)
{
const cagr = Math.pow(endValue / startValue, 1 / years) - 1;
return (cagr * 100).toFixed(2);
}
Example 2:
Refactor the given code.
Requirement: It should handle all type of data
Code:
16
function calculateCAGR(startValue, endValue, years, periodsPerYear = 1)
{
const totalPeriods = years * periodsPerYear;
const cagr = Math.pow(endValue / startValue, 1 / totalPeriods) - 1;
const annualCagr = cagr * periodsPerYear;
return (annualCagr * 100).toFixed(2);
}
Example 3:
Refactor the given code.
Requirement: Our app gets millions of requests a minute. Rewrite it so that
you can perform them well.
Code:
function calculateCAGR(startValue, endValue, years, periodsPerYear = 1)
{
const totalPeriods = years * periodsPerYear;
const cagr = Math.pow(endValue / startValue, 1 / totalPeriods) - 1;
const annualCagr = cagr * periodsPerYear;
return (annualCagr * 100).toFixed(2);
}
Example 4:
Refactor the given code.
Requirement: Make this code reusable
Code:
function calculateCAGR(startValue, endValue, years, periodsPerYear = 1)
{
const totalPeriods = years * periodsPerYear;
const cagr = Math.pow(endValue / startValue, 1 / totalPeriods) - 1;
const annualCagr = cagr * periodsPerYear;
return (annualCagr * 100).toFixed(2);
17
}
Improve code logic
Prompt:
​Give me suggestions to improve the logic of the given code and write updated
code.
Code: [paste your code here]
Example:
​Give me suggestions to improve the logic of the given code and write updated
code.
Code:
function calculateCAGR(startValue, endValue, years)
{
const cagr = Math.pow(endValue / startValue, 1 / years) - 1;
return (cagr * 100).toFixed(2);
}
18
Database Management
Writing optimized queries can take a lot of time, and writing complex
queries is very hard.
As a database developer, you may have felt this way when you had to
spend hours writing complex queries that worked well and didn't have any
mistakes. This can take a lot of time and even cause bugs in your code.
There's a better way, though! Using ChatGPT, you can write complex
queries in a few minutes.
Let's see the useful ChatGPT prompts for database management and
writing complex queries.
Writing queries
Prompt:
Write a [Language] Query
Tables: [Tables/collection list]
Requirement: [Mention your requirement]
Example 1:
Write a MySQL Query
Tables: users and orders
Requirement: It should give user details who placed highest order today
Example 2:
Write a MongoDB Query
Collections: users and orders
Requirement: It should return user information along with the total amount of
previous purchases.
19
While working on new functionality, we need test data. We can use ChatGPT
as a data feeder as follows:
Generating dummy data for testing
Prompt:
Write a query to insert records in database
Database: [Enter database name]
Table/collection Name: [Enter table name]
Columns/fields:[Enter column names]
Number of records: [Enter record count]
Example:
Write a query to insert records in database
Database: MySQL
Table Name: Users
Columns: user_id, age, dob, address
Number of records: 30
If you want to automate it using code, you can do it in the following way:
Insert dummy data
Prompt:
Write a [Language] program that insert records in database
Database: [Enter database name]
Table/collection Name: [Enter table name]
Columns/fields:[Enter column names]
20
Number of records: [Enter record count]
Example:
Write a python program that insert records in database
Database: MySQL
Table Name: Users
Columns: user_id, age, dob, address
Number of records: 30
Suppose you are not working directly with databases; you are using
frameworks like Epxress.js, Django, or Laravel, and you work with models.
You can write ORM queries using ChatGPT as follows:
Write ORM/Models queries
Prompt:
[Write a query description with the operation you want to do]
Technologies: [Enter technologies, framework and libraries]
Example 1:
Write a query that updates user age
Technologies: Express.js, Mongoose and MongoDB
Example 2:
Write a query that fetches today's sales
Technologies: Laravel and MySQL
While working on new projects or features, you will need to develop a new
schema, for this work you can use ChatGPT to do your work
21
Database design and creating schemas
Prompt: Act as a [database name] developer, I am building an e-commerce
system. Create a database scheme and write queries to create it that can be
scaled to millions of users.
Example 1:
Act as a MySQL developer, I am building an e-commerce system. Create a
database scheme and write queries to create it that can be scaled to millions
of users.
Example 2:
Act as a MongoDB developer, I am building an e-commerce system. Create a
database scheme and write queries to create it that can be scaled to millions
of users.
Don’t type the same ChatGPT prompt repeatedly. Click here to build AI
tools from your ChatGPT prompt.
22
Working with legacy code
Legacy systems have a lot of challenges, like poor code quality, a lack of
documentation, tight coupling, and old technology that is difficult to understand
for new developers.
This difficulty causes frustration and reduces developer productivity.
But using ChatGPT, we can overcome these challenges using the following
prompts:
Suppose you are working on old JavaScript code. and it is causing an error
and is difficult to understand. To understand the workings of code, you can
use the following prompt:
Understand the code
Prompt:
Explain each variable, function, and logic in the given code in detail.
Code:
[Paste your code here]
Example:
Explain each variable, function, and logic in the given code in detail.
Code:
function calculateFibonacci(n) {
if (n < 2) {
return n;
}
if (calculateFibonacci[n]) {
return calculateFibonacci[n];
}
var result = calculateFibonacci(n - 1) + calculateFibonacci(n - 2);
calculateFibonacci[n] = result;
return result;
}
23
Let's say your client's project was built using Laravel 5, but now they want to
switch to Laravel 8 to make it faster and safer. While upgrading a
programming language, framework, or library, ChatGPT will help you.
Write queries for given framework or library
Prompt:
I am upgrading to a new framework/language/technology/version of
[technology name]. rewrite the provided code for the new
framework/language/technology/version.
New framework/language/technology version: [enter version number]
Old code: [paste your code here]
Example:
I am upgrading to a new version of Laravel. rewrite the provided code for the
new framework.
New framework version: 8
Old code:
$users = DB::table('users')
->where('email', '=', $email) ->get();
24
Code Review
Some clients and managers like to look over the code before it goes live.
When you invest a lot of time and a code reviewer criticizes your work or tells
you to change the code, it creates frustration for programmers.
However, you can do your code review in a few minutes with ChatGPT and
improve its quality, which will reduce your future workload and impress your
boss or client if you write better-quality code that does not require changes.
Here are the useful prompts that will help you do the following tasks:
● Check code quality
● Write documentation
● Write uniform function and variable names
Improve code quality
Prompt:
Act like an experienced JavaScript programmer. Improve the code quality of
the given code; it should be readable, reusable, scalable, and secure.
Code: [Paste your code here]
Example:
Act like an experienced JavaScript programmer Improve the code quality of
the given code; it should be readable, reusable, scalable, and secure.
Code: [Paste your code here]
Write documentation
Prompt:
I'm writing documentation for my code. I need your assistance in writing it
using the provided code. Write simple and direct sentences to explain it.
Code: [Paste your code here]
25
Example:
I'm writing documentation for my code. I need your assistance in writing it
using the provided code. Write simple and direct sentences to explain it.
Code:
app.post('/cagr', (req, res) => {
const { initialInvestment, finalInvestment, years } = req.body;
if (!initialInvestment || !finalInvestment || !years) {
return res.status(400).json({ error: 'Missing parameters' });
}
const cagr = ((finalInvestment / initialInvestment) ** (1 / years)) - 1;
return res.json({ cagr });
});
Write code with uniform coding standards
Prompt:
I want to write clean code. Write a uniform function name and variable name
for the given code.
code: [paste your code here]
Example:
I want to write clean code. Write a uniform function name and variable name
for the given code.
Code:
let arr1=[3,2,1];
let arr2 = [6,5,4];
let result=[];for(let i=0;i<arr1.length;i++){
result.push(arr1[i]);
}
for(let i=0;i<arr2.length;i++)
{result.push(arr2[i]);}
let sum=0;
for(let i=0;i<result.length;i++){sum+=result[i];}
if(sum>=15){console.log("The sum of the arrays is greater than or equal
to 15");}
26
else{console.log("The sum of the arrays is less than 15");}
Write comments
Writing comments in code is good practice because it helps explain your
thought process, making it easier for others (and yourself) to understand and
maintain the code later.
Here is the prompt to write comments for your JavaScript code.
Prompt:
Write a short and easy-to-understand comment for the given code.
Code: [paste your code]
27
Writing third-party library code
Every programmer works with at least 5–10 third party libraries or packages in
their project. Working with third party libraries or packages is a very time
consuming task.
Sometimes one minor change or small setting takes two to three hours. But
using ChatGPT, you can do it in a few minutes by writing prompts.
While working with new libraries, you will have to not learn everything for small
tasks. You can use ChatGPT to complete your task without learning about it.
Let's take some examples.
Write code for given library or package
Prompt: I am [write your task description]. I am using the [package or library
name] library or package for [package or library type]. Write a program to do
that task.
Example 1: I am adding a chart to my website that shows real time stock
prices. I am using the HighCharts library for charts. Write a program to do that
task.
Example 2: I am writing a web scraper that scrapes the data from the table. I
am using the beautiful soup package for web scraping. Write a program to do
that task.
Write a code for specific library/package version
Prompt:
Help me write code with the given library or package.
Library: [package or library name]
Version: [package or library version]
Task Description: [enter your task description]
28
Example:
Help me write code with the given library or package.
Library: mongoose
Version: 7.0
Task Description: Write a query that calculates today's total sales.
29
Adding new logic to existing code
When you solve a bug or add a new feature at that time, you will have to add
new code to existing code.
While adding new code, first we need to understand the existing code; this
task takes a lot of time and may produce new bugs.
At that time, ChatGPT will help you understand the existing code, as we
discussed in the Working with "Legacy Code" chapter. And after
understanding code in a few minutes, you can add new code with the help of
ChatGPT.
Add a new logic code in existing code
Let's see a few prompts.
Prompt: In the existing code, [explain your task] I need your help to write
updated code.
Code: [paste your code here]
Example:
In the existing code, I'm adding a new feature to calculate a CAGR monthly,
quarterly, and yearly. I need your help to write updated code.
Code:
function calculateCAGR(initialValue, finalValue, numYears) {
const absoluteReturn = finalValue / initialValue;
const cagr = Math.pow(absoluteReturn, 1 / numYears) - 1;
return cagr;
}
// Example usage:
const initialValue = 1000;
const finalValue = 2500;
const numYears = 5;
const cagr = calculateCAGR(initialValue, finalValue, numYears);
console.log(`The CAGR is: ${cagr * 100}%`);
30
Understanding the issue with the current code
Prompt:
Help me to solve the issue and write updated code. Also explain what the
issue was and what you did to fix it.
Issue(optional):[explain issue]
Code:[paste your code]
Example:
Help me to solve the issue and write updated code. Also explain what the
issue was and what you did to fix it.
Issue: giving wrong CAGR returns
Code:
function calculateCAGR(initialValue, finalValue, numYears) {
const absoluteReturn = finalValue / initialValue;
const cagr = Math.pow(absoluteReturn, 1 / numYears);
return cagr;
}
// Example usage:
const initialValue = 1000;
const finalValue = 2500;
const numYears = 5;
const cagr = calculateCAGR(initialValue, finalValue, numYears);
console.log(`The CAGR is: ${cagr * 100}%`);
31
UI Development
You can use previous prompts in UI development to fix issues, improve code
quality, write reusable code, refactor the code, and understand the code, as
we saw in the previous chapters.
Apart from this, I will give you an idea of how to do more with ChatGPT to 10X
your work.
Let's see a few prompts:
Generate HTML Pages
Prompt:
Act as a UI Developer, Create a [write your requirement].
Technology Stack: [enter technology stack and libraries]
Color Palette : [enter hex codes]
Add animation: Yes/No
Example:
Act as a UI Developer, Create a form that accepts email, name, and terms and
conditions with a link.
Technology Stack: HTML, CSS, Bootstrap 5
Color Palette : #845EC2, #D65DB1,#FF6F91
Add animation: Yes/No
Generating colour palette
Prompt:
32
I am creating a new [website domain] website for [website and end user
description]. Create a color palette for my website that matches its users'
feelings and looks professional.
Example:
I am creating a new e-commerce website for students that sells used books.
Create a color palette for my website that matches its users' feelings and
looks professional.
Creating flex or grid layout
Prompt:
Create a responsive grid or flex layout that shows [explain your requirement]
Technologies: [Write a technology stack]
Example:
Create a responsive grid layout that shows two images on the first row and
one image on the second row.
Technologies: HTML, CSS
Improving current UI
Prompt:
Improve the current UI with animation, smooth font, and add a good look and
feel by keeping the same font family and color palette.
HTML: [paste your HTML code here]
CSS: [paste your CSS code here]
Example:
Improve the current UI with animation, smooth font, and add a good look and
feel by keeping the same font family and color palette.
33
HTML:
<div class="card">
<img src="image.jpg" alt="Card Image">
<div class="card-content">
<h3>Card Title</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla nec
mollis tellus. Curabitur ac tellus lectus. Aliquam pretium euismod
dapibus.</p>
<a href="#" class="button">Learn More</a>
</div>
</div>
CSS:
.card {
border: 1px solid #CCC;
border-radius: 4px;
overflow: hidden;
box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
}
.card img {
width: 100%;
height: auto;
}
.card-content {
padding: 20px;
}
.card-content h3 {
margin-top: 0;
}
.card-content p {
margin: 0;
margin-bottom: 10px;
}
.button {
display: inline-block;
padding: 10px 20px;
background-color: #4CAF50;
34
color: #FFF;
border-radius: 4px;
text-decoration: none;
}
.button:hover {
background-color: #3E8E41;
}
Working with API
​If you use APIs for your application, you have to show the response or data
you received from the API on your website. ChaGTP can do it in a few
minutes. ChatGPT can help you with
1. Creating the new UI for the given technology
2. Display data in the existing design
3. Display error and success messages from APIs
Let’s see them one by one with examples.
Display API Data
Prompt:
Write a code to display given API data. When a request is sent, show the
loader, and after getting the response, display the data.
UI requirement: [Explain your requirement]
Technology: [Enter technologies]
API Data: [Paste you API response]
Example:
Write a code to display given API data. When a request is sent, show the
loader, and after getting the response, display the data.
UI requirement: Create a responsive design, that contains page headers and
tables.
35
Technology: Bootstrap 4, React, HTML, and CSS
API Data:
[
{
"id": 1,
"title": "The Catcher in the Rye",
"author": "J.D. Salinger",
"publication_year": 1951,
"genre": "Literary Fiction",
"pages": 277
},
{
"id": 2,
"title": "To Kill a Mockingbird",
"author": "Harper Lee",
"publication_year": 1960,
"genre": "Southern Gothic",
"pages": 324
},
{
"id": 3,
"title": "Pride and Prejudice",
"author": "Jane Austen",
"publication_year": 1813,
"genre": "Romance",
"pages": 368
},
{
"id": 4,
"title": "1984",
"author": "George Orwell",
"publication_year": 1949,
"genre": "Dystopian",
"pages": 328
},
{
"id": 5,
36
"title": "Brave New World",
"author": "Aldous Huxley",
"publication_year": 1932,
"genre": "Dystopian",
"pages": 311
}
]
Display API Data in the existing UI
If your UI is ready and you have to display the API data, you can pass your
existing code and ask ChatGPT to integrate the data into the given design.
Prompt:
Integrate the given API data into the given design.
Code: [paste your code here]
API Data: [paste API response data here]
Example:
Integrate the given API data into the given design.
Code:
<table>
<thead>
<tr>
<th>#</th>
<th>Title</th>
<th>Author</th>
<th>Publication Year</th>
<th>Genre</th>
<th>Pages</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
37
<td>The Catcher in the Rye</td>
<td>J.D. Salinger</td>
<td>1951</td>
<td>Literary Fiction</td>
<td>277</td>
</tr>
<tr>
<td>2</td>
<td>To Kill a Mockingbird</td>
<td>Harper Lee</td>
<td>1960</td>
<td>Southern Gothic</td>
<td>324</td>
</tr>
<tr>
<td>3</td>
<td>Pride and Prejudice</td>
<td>Jane Austen</td>
<td>1813</td>
<td>Romance</td>
<td>368</td>
</tr>
<tr>
<td>4</td>
<td>1984</td>
<td>George Orwell</td>
<td>1949</td>
<td>Dystopian</td>
<td>328</td>
</tr>
<tr>
<td>5</td>
<td>Brave New World</td>
<td>Aldous Huxley</td>
<td>1932</td>
<td>Dystopian</td>
<td>311</td>
</tr>
</tbody>
38
</table>
API Data:
[ { "id": 1, "title": "The Catcher in the Rye", "author":
"J.D. Salinger", "publication_year": 1951, "genre": "Literary
Fiction", "pages": 277 }, { "id": 2, "title": "To Kill a
Mockingbird", "author": "Harper Lee", "publication_year":
1960, "genre": "Southern Gothic", "pages": 324 }, { "id": 3,
"title": "Pride and Prejudice", "author": "Jane Austen",
"publication_year": 1813, "genre": "Romance", "pages": 368 },
{ "id": 4, "title": "1984", "author": "George Orwell",
"publication_year": 1949, "genre": "Dystopian", "pages": 328
}, { "id": 5, "title": "Brave New World", "author": "Aldous
Huxley", "publication_year": 1932, "genre": "Dystopian",
"pages": 311 } ]
Display error and success messages from APIs
Handling error messages is one of the more tedious tasks. ChatGPT can help
you handle the API errors and messages and show them to the users via
alerts. Here is the prompt that will help you complete this task.
Prompt:
I am working with APIs,Write a code to handle all possible users. and success
messages and show them to users.
Technology to show response: [enter front-end technologies]
Response description: [explain possible errors or give API name if you are
using popular APIs like Google Map, Twitter API etc.]
Example:
I am working with APIs,Write a code to handle all possible users. and success
messages and show them to users.
Technology to show response: Tailwind and HTML
39
Response description: API may give authentication error, token expire error
and api not found error
Build Components
When you have to create less complex components of component structure
like Card Layout, Menu, Lists, Popups, Landing Pages, Pricing Pages etc. To
do this job, ChatGPT can help you in the following way.
Prompt
Act like a senior UI developer Build/Create [explain the component details in
detail]. The design should be responsive and professional and use top design
principles to make it clean.
Technology: [Specify the technology stack needed]
Content(Optional): [Insert content data]
Example 1 - Create the pricing table layout:
Act like a senior UI developer, Create a pricing table layout that displays
different subscription plans, each with its features and pricing details. The
table should highlight the recommended plan, have a hover effect, and a
clickable "subscribe" button.The design should be responsive, professional
and use top design principles to make it clean.
Technology: HTML, CSS, Tailwind, React
Table content: Add 5 dummy features with checkmark and cross mark and
add discount badge in recommended plan
Example 2: Build modals
Act like a senior UI developer, Build a responsive modal that displays
additional information upon clicking a button. The modal should have a close
button, a title, and a description.
Technology: HTML, CSS, Bootstrap
40
Example 3: Build layouts
Act like a senior UI developer, Build a card-based grid layout that displays
various items with a title, description, and image thumbnail. The grid should
have a hover effect that enlarges the image, and each card should contain a
clickable link.
Technology: HTML, CSS, Tailwind, Angular
Example 4: Create a login page
Act like a senior UI developer, Create a login page that validates the user
authentication and redirects to the homepage upon success. The login page
should have username and password fields, forgot password link, and
remember me checkbox.
Technology: HTML, CSS, JavaScript
Validation message: [Enter validation messages(optional)]
Example 5: Develop a Navigation Menu
Act like a senior UI developer, Develop a navigation menu that collapses and
expands upon clicking on the hamburger icon. The menu should also have
sub-menus displayed upon mouse hover. Add smooth animation while
collapsing.
Technology: HTML, CSS, JavaScript, React
Navigation items: [Insert navigation items]
Prompt
Act like a senior UI developer. You create responsive, reusable, and
professional components that are easy to use for the users. Create a
component for my given requirement and write code for me.
41
The technology stack is: [Enter your technology stack]
The requirement is: [Enter your component requirement]
Example:
Act like a senior UI developer. You create responsive, reusable, and
professional components that are easy to use for the users. Create a
component for my given requirement and write code for me.
The technology stack is: HTML, CSS, Tailwind
The requirement is: Create a card that contains Title, then small description
and badges at the bottom
Create email templates
If you work in a startup or with a marketing team, You may need to design
email templates to send emails to users. There are many email clients
available in the market like Gmail, Outlook, and Apple Mail.
Writing responsive templates is a very time consuming task. Using the below
prompt you can build email templates in a few minutes
Prompt:
Act like a senior UI developer with marketing skills. Create a responsive email
template that contains the brand logo, a title, email content, a call to action
button, a website link, social media icons, and an unsubscribe link. It should
work on all email clients and browsers.
Make a template for: [Enter your template type]
Example:
Act like a senior UI developer with marketing skills. Create a responsive email
template that contains the brand logo, a title, email content, a call to action
button, a website link, social media icons, and an unsubscribe link. It should
work on all email clients and browsers.
Make a template for: Product Updates
42
​Create
React components
Prompt:
Act like a senior React developer. You create responsive, reusable, and
professional React components that are easy to use for the users. Create a
component for my given requirement and write code for me.
The technology stack is: [Enter your technology stack]
The requirement is: [Enter your component requirement]
Example:
Act like a senior React developer. You create responsive, reusable, and
professional React components that are easy to use for the users. Create a
component for my given requirement and write code for me.
The technology stack is: HTML, CSS, Bootstrap, React
The requirement is: Create a table to show active subscriptions
43
Server Side Work
As a web developer, it's your job to make and maintain a website that meets
the needs of the client. One of the most challenging aspects of your job is
server management.
You need to make and set up domains, add subdomains, install and set up
technologies and packages, keep an eye on the server and take care of it, and
run commands on the server side.
It's time-consuming, complex, and frustrating, especially if you're not familiar
with the process. Plus, it can take away valuable time from building and
improving the website.
Let's see a few prompts.
Server setup and configuration
Prompt:
I am uploading my website to the production server. Tell me the steps to setup
my environment on the server.
Operating System: [Enter operating system name]
Technology stack: [Enter your website technology stack]
Server(optional): [Enter server type for website]
Example:
I am uploading my website to the production server. Tell me the steps to setup
my environment on the server.
Operating System: Ubuntu
Technology stack: JavaScript, MongoDB, React, Express.js, HighCharts
Server: Nginx
44
Automating database backup
Prompt:
I am using [database name] for my website. Tell me the steps to automatically
backup the data on the server.
Backup duration: [enter the number of days or months]. days
Example:
I am using MongoDB for my website. Tell me the steps to automatically
backup the data on the server.
Backup duration: 7 days
Improve server security
Prompt:
Tell me the steps to improve server security. My technology stack is given
below
Server: [enter server name]
Technology stack: [enter technology stack]
Example:
Tell me the steps to improve server security. My technology stack is given
below
Server: Nginix
Technology stack: JavaScript, MongoDB, React, Express.js, HighCharts,
Certbot
Ask commands to complete your tasks:
Prompt: I am using [write your server details] for website hosting, [ask question]
45
Example 1: I am using Ubuntu and nginx for website hosting. Can you tell me the
commands to monitor the system?
Example 2: I am using Ubuntu for website hosting. Tell me the command to change file
permissions.
Schedule cron jobs
Cron job is a time-based job scheduler used to automate repetitive tasks on
Unix-like operating systems.
It can be difficult to schedule because of its complex syntax, which requires
precise configuration to avoid errors or running at the wrong time.
At that time, ChatGPT can help you schedule cron jobs without error.
Prompt:
I have to schedule a cron job that will run [explain the time and day you have
to schedule it]. Write a command for it.
Example 1:
I have to schedule a cron job that will run every day at 3 p.m. and 7 p.m. Write
a command for it.
Example 2:
I have to schedule a cron job that will run every Monday at 1 a.m. Write a
command for it.
46
Interview Preparation
Preparing for interviews can be a tedious task with many steps, like making a
resume, researching companies, understanding job requirements, practicing
coding skills, updating knowledge, and sending emails to recruiters.
Instead of wasting time on these other things, we should be studying and
getting ready to seize opportunities. Finding a new job while still working for a
company can be hard and take a lot of time for experienced professionals.
At that time, ChatGPT can help you prepare for the interviews as follows:
Understanding company requirements
Prompt:
Give a brief explanation of the most crucial abilities mentioned in the job
description.
Job Description:[paste job description]
Example:
Give a brief explanation of the most crucial abilities mentioned in the job
description.
Job Description:
We are looking for a talented and experienced MERN Stack Developer to join
our team. As a MERN Stack Developer, you will be responsible for developing
and maintaining our web applications using the MERN stack.
Responsibilities:
● Developing and maintaining web applications using the MERN stack
(MongoDB, Express.js, React.js, and Node.js)
● Writing clean, well-documented, and efficient code
● Collaborating with cross-functional teams, including designers, product
managers, and other developers, to deliver high-quality software
solutions
● Participating in the full software development lifecycle, including design,
development, testing, deployment, and maintenance
47
● Identifying and troubleshooting software defects and bugs
● Keeping up-to-date with emerging trends and technologies in web
development
Requirements:
●
●
●
●
●
●
●
●
Strong experience in web development using the MERN stack
Proficiency in JavaScript, HTML, CSS, and related web technologies
Familiarity with RESTful APIs and web services
Experience with database technologies, such as MongoDB or other
NoSQL databases
Knowledge of version control systems, such as Git
Experience with agile development methodologies
Excellent problem-solving, analytical, and communication skills
Bachelor's or Master's degree in Computer Science, Software
Engineering, or a related field
Preferred Qualifications:
● Experience with other front-end frameworks, such as Angular or Vue.js
● Familiarity with AWS or other cloud computing platforms
● Understanding of containerization and related technologies, such as
Docker and Kubernetes
● Contribution to open-source projects
If you are a self-starter with a passion for developing high-quality web
applications using the MERN stack, we encourage you to apply for this
exciting opportunity to join our team.
Build resume
Create resume template
Prompt:
I am [your current position], and I want you to create a one-page resume
template that grabs recruiters' attention in a few seconds.
Job Role: [recruiters given position]
My skills: [enter your skills that is required for new position]
48
Example:
I am a full-stack web developer, and I want you to create a one-page resume
template that grabs recruiters' attention in a few seconds.
Job Role: MERN Stack Developer
My skills include JavaScript, Node.js, Express.js, HTML, CSS, MongoDB,
Tailwind CSS, Postman, working with APIs, and building microservices.
Write career objective or project description
Prompt:
I am creating a resume for my new job. Write an attention grabbing objective
or project description in two lines that will send a clear message to the
recruiter about how I can help their organization. Write it by analysing the job
description.
Job Role: [Write job role]
Job Description: [Enter Job Description]
Number of variations: [number of variations do you want]
Example:
I am creating a resume for my new job. Write an attention grabbing objective
in two lines that will send a clear message to the recruiter about how I can
help their organization.
Job Role: Java Developer
Job Description: [Paste job description]
Number of variations: 5
Improve career objective or project description
Prompt:
49
I am creating a resume for my new job, to help me improve my objective or
project description.
Objective or project description: [paste here]
Example:
I am creating a resume for my new job, to help me improve my objective.
Objective: Experienced Java Developer seeking to leverage my expertise in
software development to drive innovation and contribute to the success of an
organization.
Analyze the job description:
Act like a career coach, Go through the given job description carefully and
figure out the main duties, important skills, and needed qualifications. And
tell me what objective I should write about and which important skills I
should mention in the resume.
My job description is: [paste_job_description]
Interview Preparation
Get practice problem
Prompt 1:
I am preparing for the [enter technology] technical interview. And I have [insert
your experience in technology] years of experience in [insert technology]. List
out the [problem count] practice problems to do in preparation for the
interview.
Example:
I am preparing for the JavaScript Technical Interview. And I have five years of
experience in JavaScript. List out the 10 practice problems to do in
preparation for the interview.
50
Prompt 2:
I am preparing for an HR interview for a [enter your job title]. Give me the top
[count] questions that HR asks.
Example:
I am preparing for an HR interview for a Java developer position. Give me the
top 10 questions that HR asks.
Verify your answers
Prompt:
I am preparing for the interview. Verify my answers for a given question. If
there is any error, please explain it to me, or tell me what improvements I can
make to the answer.
Question: [write question or problem statement]
Answer: [enter your answer]
Example
I am preparing for the interview. Verify my answers for a given question. If
there is any error, please explain it to me, or tell me what improvements I can
make to the answer.
Question: Write a function that takes in a string and returns the length of the
longest word in the string.
Answer:
function longestWordLength(str) {
let words = str.split(" ");
let longest = 0;
for (let i = 1; i <= words.length; i++) {
if (words[i].length > longest) {
longest = words[i].length;
}
}
return longest;
}
51
let str = "The quick brown fox jumped over the lazy dog";
console.log(longestWordLength(str));
Get Interview Tips
Prompt 1:
I am attending the [round number] round of my technical interview. Give me
the tips I need to crack the interview.
Technology stack: [enter your tech stack]
Example:
I am attending the first round of my technical interview. Give me the tips I need
to crack the interview.
Technology stack: HTML,CSS,JavaScript,Node.js
Prompt 2:
I am preparing for an HR interview for a [enter job role]. Give me the tips I
need to crack the interview.
Example:
I am preparing for an HR interview for a Java developer position. Give me the
tips I need to crack the interview.
Sending Emails
Write a mail to send resume
Example:
I have to send my resume for the [enter your role] to HR. Write a short email
with an attention grabbing subject line.
My technology stack: [enter technology stack]
52
My experience: [enter your experience]
Prompt:
I have to send my resume for the JavaScript Developer Position to HR. Write
a short email with an attention grabbing subject line.
My technology stack: HTML, CSS, JavaScript, Node.js, MongoDB
My experience: 5 years
Give reply to recruiters mail
Prompt:
I got an email from [enter recruiter role]. Write a confident and short response
to the given email.
Example:
I got an email from HR. Write a confident and short response to the given
email.
Email:
Dear Chetan,
Thank you for applying for the JavaScript Developer role at Google. We are pleased to
inform you that your application has been shortlisted, and we would like to invite you to
an interview.
The interview will be held on 20 July 2023 at 12.30PM at our office located at California.
Please arrive at least 10 minutes before the scheduled time. The interview process will
take approximately 1 hour.
During the interview, you will have the opportunity to meet our team and learn more
about the company, the position, and the responsibilities associated with the role. We
will also ask you a few questions to understand your skills, experience, and suitability for
the role.
Please bring a copy of your updated resume and any other relevant documents that you
would like to share with us.
If the interview schedule is not convenient for you, please let us know, and we will
arrange a more suitable time.
53
Please confirm your availability by replying to this email.
We look forward to meeting you in person and discussing your application.
Best regards,
Lilly, HR
Take mock interview
Mock interviews are like practice sessions for real job interviews. They help us
get comfortable with the interview process and teach us how to answer tough
questions.
We can learn from any mistakes because these are just , not the real thing.
They also help build confidence and improve how we present ourselves.
Doing well in a real interview is more likely if we've had this kind of practice
before.
You can take a mock interview using ChatGPT, Using the below prompt,
ChatGPT will ask you questions and give you feedback according to your
answers.
Prompt:
Take my mock interview for the given role, Ask me one question at a time
and get an answer from me. Then ask the next question. After finishing the
interview, give me feedback and areas for improvement.
Job role is: [Enter job role]
My experience in years: [Enter your experience]
Total number of questions: [Enter total number of questions to ask]
54
Sending emails to clients and boss
As a software developer, you have to do more than just write code to make
software. You also have to talk to your client, boss, and team members.
From my experience, software hates to write emails, so using ChatGPT, you
can write emails in a few minutes as follows:
Write status update email
Prompt:
I have to send an email to the [client or boss] to update the status of the given
task. Write a professional and optimistic email.
Task status: [explain your completed task and uncompleted tasks details]
Task completion rate: [completion percentage]
Example:
I have to send an email to the client to update the status of the given task.
Write a professional and optimistic email.
Task status: Added daily, monthly, and yearly sales charts; working on the
Excel downloading feature
Task completion rate: 70%
Write a requirement clarification email
Prompt:
I have to send an email to the [client or boss] to get more clarification about
the requirement. Write a short, polite email about it.
Things to clarify:
1. [requirement/problem 1]
2. [requirement/problem 2]
3. [requirement/problem 3]
55
Example:
I have to send an email to the client to get more clarification about the
requirement. Write a short, polite email about it.
Things to clarify:
1. What are the inputs we have to take while checking out?
2. What will the response message be after placing the order?
3. Do we have to send emails to pending order customers?
Write emails for leave applications
Prompt:
Write a polite email to my boss asking for the leave for the given work and
duration.
Leave type: [leave type]
Reason: [reason of leave]
Duration: [enter date range]
Example:
Write a polite email to my boss asking for the leave for the given work and
duration.
Leave type: casual
Reason: going home
Duration: 4-10 March
Don’t type the same ChatGPT prompt repeatedly. Click here to build AI
tools from your ChatGPT prompt.
56
57