Develop Your App from Start to Finish with ChatGPT
Read more
Develop Your App from Start to Finish with ChatGPT
Jakov Semenski
480 min read
2023-09-21 10:55:02
0 Likes
0 Comments
Dive deeper into the world of AI innovation and stay ahead of the AI curve! Subscribe to our AI_Distilled newsletter for the latest insights. Don't miss out – sign up today!
Introduction
Everyone is using ChatGPT to code.
But almost everyone is stuck in “hello world” mode.
I will show you 9 techniques on how you can get massively ahead by using these prompts to create an app from start to finish
Before we start, let's dive into a typical scenario when coding an app from 0.
Why creating an app is so difficult?
So, you've got coding basics.
But jumping from that to building a full-blown app seems like leaping over a skyscraper. Right?”
Every developer faces the same dilemma.
Where do I start?
Which tech stack to use?
Should I use a framework?
What steps do I need to take?
There are just too many options out there, and without having vast experience, which approach you take?
Traditional approach
Spend hours reading documentation
Trial and error coding
Seeking help on forums
ChatGPT-Assisted approach
Describe your objective or challenge to ChatGPT
Get guided solutions
Refine as per your needs
And implement
Issues with ChatGPT-assisted approach
Maybe you’ve tried using ChatGPT, but you’re still stuck in a “HELLO WORLD” mode.
Most of the time ChatGPT spits out Hello World examples.
You don’t even have an idea about the tech stack.
All you get are code snippets.
Output is nowhere near a full-blown app.
The coding output might be working, but the delivery is not so much, let’s change that.
Use these 9 steps instead:
Step 1: Ideation process
You know what you want to build an app, but don’t know where to start.
You can start with, “give me ideas on library app”.
The problem with that one, it’s too vague, and ChatGPT cannot give you a clear and concise response.
Do this instead:
Specify as much as you can regarding the app
Specify your role
Ask for output in table format with pros, cons
WHO AM I
I work as a software developer
APP DESCRIPTION
I need to build a backend of an application from scratch where
users can borrow technical books,
users with admin role can administrate books and other users
TOPIC
Outline 4 technical solutions
which tech stack is used, frameworks, language and framework versions
where it can be deployed
FORMAT
When discussing potential solutions
present the information in a table format,
outlining the pros and cons of each option—allowing for
easier comparison and decision-making.
ChatGPT will respond
#
Tech Stack
Deployment Options
Pros
Cons
1
MEAN (MongoDB, Express.js, Angular, Node.js)
Heroku, AWS, Digital Ocean
JavaScript across full stack<br> - Scalable <br> - Large community
Callback hell if not careful<br> - Angular has a steeper learning curve
2
MERN (MongoDB, Express.js, React, Node.js)
Heroku, AWS, Netlify, Vercel
Popularity of React<br> - Flexibility and modularity<br> - Large community
Lots of libraries/tools to manage<br> - Callback hell if not careful
3
Spring Boot (Java) with PostgreSQL
AWS, Azure, Heroku, Google Cloud
Robust and mature<br> - High performance<br> - Type safety with Java
Higher memory consumption<br> - Slower development cycle
4
Django (Python) with PostgreSQL
AWS, Heroku, Google Cloud, Digital Ocean
"Batteries-included" framework<br> - Admin interface out of the box<br> - High productivity
ORM might not suit large-scale apps<br> - Heavier compared to Flask
Elaboration:
MEAN Stack:
MongoDB: A NoSQL…..
Step 2: Specify the knowledge level
ChatGPT doesn’t know which language, tools and frameworks you are familiar with.
For example, a junior might say
I’m a backend software developer and solely use Java.
I am familiar with Java 7, but don't have experience with Stream API
Or a senior might say
I’m an experienced backend software developer and solely use Java.
I am familiar with Java 17, and with latest Spring boot framework
You can use this prompt to further narrow down tech stack, or to start coding
Step 3: Outline the app before we start coding
Now you have the idea, but still, you don’t know how many files you need to cover.
Before you dive into coding, ask ChatGpt to give you the representation of your project and how it would look in your IDE.
Outline project structure with the usage of emojis representing file and directory types.
For our project show me the directory structure using ASCII
and emojis to represent directory and file types
Step 4: Specify coding output
Some of us hate when ChatGPT gives back so verbose explanations .
Unlock access to the largest independent learning library in Tech for FREE!
Get unlimited access to 7500+ expert-authored eBooks and video courses covering every tech area you can think of.
Renews at $19.99/month. Cancel anytime
And then barely can give out code before it hits the output limit.
Do this instead:
When I ask you for code, please just give me the
code without any explanation on how it works.
Don't include import statements.
Bias towards the most efficient solution.
Remember: The more context you provide, the better the AI can guide and offer tailored solutions.
Step 5: We don’t want code vomit
Back in the days when there were no coding guidelines, developers were rewarded with the amount of code they produced.
Nowadays, with so many new hires and leavers, we need to leave the code base in a good state, so the next person who joins can follow up.
To prevent ChatGPT from vomiting code, let it use the latest coding principles.
Write clean code
Code needs to be covered with Logging and proper exception handling
Use principles: Kiss & DRY, SOLID
Keep in mind to use design patterns where it is applicable
Now you can ask ChatGPT to give you code.
Using coding instructions I gave you, give me code for each class
Apart from Code, you will also get an explanation of where ChatGPT used those principles.
ChatGPT explaining output.
KISS: It's straightforward and easy to understand.
DRY: The exception handling and logging are centralized.
SOLID:
S: Single Responsibility - Each class has one job.
O: Open/Closed - Classes are open for extension, but closed for modification.
L: Liskov Substitution - Derived class must be substitutable for its base class.
I: Interface Segregation - We've used the necessary interfaces.
D: Dependency Inversion - High-level modules are not dependent on low-level ones; both depend on abstractions.
Design Pattern:
Repository Pattern: Used to separate database access code from business logic.
Service Pattern: Business logic is placed in the service layer.
Singleton Pattern: Spring beans are singleton by default.
Decorator Pattern: The ControllerAdvice acts as a decorator around all controllers, providing centralized exception handling.
Optional: IDE support
In case you are new to coding and don’t have much experience with using IDE (Integrated development environment).
Ask ChatGPT to instruct you how to import this project.
I am using IntelliJ IDE, maven project,
give me steps I need to take to import such a project
Step 6: Write test classes
We can ask it to write tests, but let's be more specific.
Give ChatGPT library names, and approaches and specify which kind of tests you want to write.
Using most popular testing libraries, write Integration test, Unit test
Use Mockito BDD and AssertJ libraries
For Integration tests use Test slices
Step 7: Give example data
Our app will not work without testing data, this could be.
Database sample data
Testing strategy
Write SQL statements that prepopulate our app the first time it starts with testing data
Define which files need to be created and where they should be placed
Step 8: Specify other infrastructure components
Maybe you are using an embedded database, or you already have one running in the cloud or locally in a docker container.
Give ChatGPT instructions on what systems do you use and how.
I want to use an embedded database and authenticate against spring embedded oauth
Step 9: How can I use the app
Now you have your REST service available, but how do you test it?
Ask ChatGPT to give you requests that you can use with Postman.
Write CURL statements I can execute in terminal or import in postman to
Get access token
List all available books
To add new book
Here is an example of what ChatGPT can produce.
Conclusion
Now you went from the “Hello World” stage to the “I am Crushing” stage
I have a full step-by-step guide to writing a full-blown app from start to finish by following the latest coding guidelines and principles.
Use those steps, play around, and you can even follow through all prompts directly in ChatGPT by going to this link: