But forg is a high-performance file-organising CLI tool that challenges this assumption. In our benchmarks, forg moved 20,000 files totalling 22.27 GB in just 2.02 seconds.

That is a "logical throughput" of 11.27 GB/s, far exceeding the physical sequential write speed of almost any consumer drive on the market.

How? The answer lies in understanding that moving a file is rarely about the file itself. Let's understand a little about how forg utilises this concept.

First of all, what is forg?

forg is a regex-based CLI tool designed to solve the "messy Downloads folder" problem. Written in Rust, it leverages low-level system calls with zero-cost abstractions, ensuring negligible overhead to the OS's native speed.

It uses regex patterns to scan directories and instantly sort files into categorised folders (e.g., .png to Pictures, .mp4 to Videos). Moreover, you can customise all the regex patterns and the destination folders tailored to your workflow.

While the automation is convenient, its speed is what surprises users most.

How fast does forg perform with different volumes of data?

Here is how it performs on a standard macOS environment with an APFS (Apple File System):

The performance results show that the move time is proportional to the number of files, independent of the volume of the files.

Note: See the exact performance testing environment details here.

The Misconception: Moving v/s Copying

Most people think of "moving" a file as:

1. Copying the data to a new location.

2. Deleting the data from the old location.

If this were true, moving 20GB would take at least 10–20 seconds on a fast SSD (assuming typical ~2GB/s write speeds). This notion, however, is only partially correct.

The reality

To understand why forg is so fast, we have to look at how Operating Systems (like macOS with APFS or Linux with ext4) actually store files.

Internally, a directory is just a special type of file that maps a filename to an inode (the actual address of the data on the disk).

Think of the filesystem like a library. Moving a book from the 'Science' shelf to the 'History' shelf doesn't require rewriting the book. You just update the index in the library's catalog. The book stays exactly where it was on the physical floor; only its 'address' in the system changes.

So what happens when we 'move' a file?

Internally, the OS changes the mapping of the inode from the source directory to the destination directory. The file's physical address remains the same, but the mapping is changed.

Similarly, when forg moves a file within the same drive partition, it uses the atomic fs::rename system call (which performs the same logical operation discussed above).

'Atomic rename' means the operation is all-or-nothing. If the computer loses power midway, the OS ensures the entry is either in the old location or the new one, with no 'in-between' state.

The actual data on the disk never moves. Not a single bit of the file content is read or written. This is a metadata-only operation.

This is why forg's move time is proportional to the number of files, not the size of the files (as reflected in the performance results section above). Moving a 1KB text file takes the exact same amount of time as moving a 10GB 4K movie.

The edge case: Moving to an external drive

However, the file-moving logic changes completely when you move a file to an external drive or a different partition.

Because the destination drive has its own separate physical disk and filesystem, the OS must physically copy the data across the cable and then delete the original. In this scenario, the file-moving operation becomes I/O-bound. The speed is now strictly limited by the SSD’s write speed or the USB port's bandwidth.

The reason this happens is that an inode has meaning within a single filesystem partition only. Once you cross that boundary (e.g., from your internal SSD to a USB Drive), the bits must physically travel.

Key takeaways

• Metadata-bound operation: Moving files within the same drive is just a "label change" in the filesystem’s ledger.

• Atomic Renaming: Using fs::rename ensures that if a move fails, the file isn't lost or corrupted.

• I/O-bound operation: Moving files to a different drive involves copy-and-delete sequence as the destination now has a separate filesystem of its own.

• Logical Throughput: When you see forg hitting 11 GB/s, it’s indicating how fast the OS can update its own mapping records.

Experience the speed yourself

The next time you’re organising your cluttered folders, don't do it manually. Use forg to get it done in no time.

Checkout the official documentation for installation steps, or contribute to the performance-first logic on Github.

Nobody wants to get hacked, right?

Just imagine someone walking into your bank and claiming to be you, or worse, someone accessing your personal data by pretending to be your trusted application. When authentication goes wrong, it's not just about losing data—it's about losing trust, money, and sometimes even your reputation.

A single-pass barcode to protect our system

What if we had something that could only be used once so the server knows that this request has been made before? Just like a concert ticket with a unique barcode becomes useless once you've used it to enter. This simple idea helps us catch anyone trying to replay old requests to trick our system. This concept is called nonces or "Number used once" and we're going to learn exactly that.

Understanding Nonces

What is a nonce?

A nonce is a random or pseudo-random number that can only be used once within a cryptographic communication. Nonces are mostly used to preventing replay attacks, where an attacker intercepts a valid request and tries to send it again to gain unauthorised access.

Think of it as giving each request a unique fingerprint that the server can remember and reject if it sees the same fingerprint twice. This way, even if someone captures your login request, they can't simply replay it because the nonce makes each request unique and time-sensitive.

Where do we see Nonces?

Beyond simple prevention of replay attacks, you might see nonces at different places:

• API Authentication and OAuth2: Nonces help maintain session integrity and freshness of a request.

• Blockchain based transactions: Nonces prevent double spending attacks.

• Password reset tokens & multi-factor authentication: depend on nonces or nonce-like mechanisms.

Building a Secure Authentication System

Why not go with traditional authentication?

Traditional authentication systems (and many systems even now) typically work in a straightforward manner where

• Client sends credentials to the server, and

• Server responds with a token or session identifier if the credentials are valid.

Traditional systems treat each request independently without any mechanism to detect if the same request has been sent before. This creates a possibility where an attacker can intercept a valid authentication request and replay it multiple times to gain unauthorised access.

Consider a mobile banking app that sends your login credentials over HTTPS. While the transport is encrypted, if an attacker captures the encrypted request, they can replay it later when you're offline to get the credentials from your bank and access your account. The bank server has no way to distinguish between your legitimate login attempt and the attacker's replay because both requests look identical.

Introducing Nonces into the Authentication Process

To solve the above problem, a nonce gets introduced at the very beginning of the authentication handshake, before any sensitive credentials are exchanged between the client and server. Here's exactly how it works:

1. When a client wants to authenticate, it first makes a request to the server asking for a fresh nonce, and the server generates a unique, time-limited number and sends it back to the client.

2. The client then takes this nonce, combines it with their credentials (often through hashing or signatures), and sends this combined package back to the server for verification.

3. The server checks both the validity of the credentials and ensures that the nonce hasn't been used before and hasn't expired, effectively creating a two-factor verification system.

This process transforms each authentication attempt into a unique, non-replayable event because even if an attacker captures the entire exchange, the nonce expires and becomes useless for future attempts.

Implementing Nonces

Generating Nonces Securely

A secure nonce must be unique and unpredictable. The most reliable approach involves using a timestamp (uniqueness), combined with random elements (unpredictability). Epoch timestamps work exceptionally well for nonce generation because they naturally provide uniqueness over time—no two requests can have the exact same timestamp down to the millisecond. However, using timestamps alone would make nonces predictable, which is why we need to add a random component to them.

// Function to generate a nonce (a pseudo-random set of digits)
const generateNonce = () => {
    const currentTimeStamp = Date.now();
    const randomThreeDigits = Math.floor(Math.random()*900) + 100; // always ensures a 3-digit number
    return `${currentTimeStamp}${randomThreeDigits}`;
};

This combination creates nonces that are mathematically unique across time and computationally unpredictable, giving your authentication system both reliability and security.

Ensuring Communication Security

Combine nonces with the payload to create a unique package

The most effective approach is to create a hash (also called a fingerprint) that incorporates both the actual payload and the nonce, making replay attacks impossible even if the hash itself is compromised, as nonces are unique and can be used only once, and so is the hash. Here's how to implement secure credential hashing with nonces:

const crypto = require('crypto');

// Utility: creates a hash
function createSecureHash(password, nonce, salt) {
    // Combine password, nonce, and salt for maximum security
    const combined = `${password}:${nonce}:${salt}`;

    // Use SHA-256 for hashing
    const hash = crypto.createHash('sha256')
        .update(combined)
        .digest('hex');

    return hash;
}

// Utility: generates a nonce
function generateNonce() {
    const currentTimeStamp = Date.now();
    const randomThreeDigits = Math.floor(Math.random()*900) + 100; // always ensures a 3-digit number
    return `${currentTimeStamp}${randomThreeDigits}`;
}

// Example usage on client side
function authenticateUser(username, password) {
    const nonce = generateNonce();
    const salt = 'your-app-specific-salt'; // Should be unique per application
    const passwordHash = createSecureHash(password, nonce, salt);

    return {
        username,
        passwordHash,
        nonce
    };
}

This approach ensures that even if an attacker captures the hash, they can't reuse it because the nonce changes with each request, making the hash completely different every time.

In traditional authentication requests, the credentials (username and hashed password) are sent directly to the backend without a nonce. A hacker need not know your password to hack you, but they just need the entire HTTP request (maybe via the cURL or something) to replay the authentication request and mimic you.

After using nonces, for a hacker to be able to ‘hack’ your account, they need to know your exact password now. Therefore, nonces have reduced a layer of vulnerability by adding another security layer.

Some things to keep in mind!

Effective Key Management and Rotation

Rotate your nonce generation keys every 30-90 days and never store them in your application code. Set up automated alerts when keys are about to expire so your authentication system doesn't suddenly break in production.

Managing State with Nonces

Store used nonces in a fast database like Redis with automatic expiration to prevent memory bloat, and always check if a nonce has been used before accepting any authentication request.

Handling UX and debugging

Set nonce expiration times between 5-10 minutes to balance security with user experience. Log nonce generation and validation events (never log the actual nonce values) to help troubleshoot authentication issues in production.

Conclusion

We've journeyed from understanding the fundamental vulnerability of replay attacks to implementing a complete nonce-based authentication system that transforms your application from a sitting duck into a fortress that knows the difference between legitimate users and malicious imposters.

A few extra lines of code and infrastructure setup you invest in nonces today could save you from the nightmare of explaining to users why their data was compromised tomorrow, so make security a priority from day one, not an afterthought when it's too late.

Catch you in the next one.
Goodbye!

By the end of this article, you will have a robust and secure server environment ready for confidently deploying your applications, along with the necessary knowledge of all the key concepts, tools, and terminologies.

Why deploy apps online?

Any app residing on the local machine (i.e., the local host) is inaccessible to others, so we must deploy our applications online for global accessibility. Moreover, a deployed backend application lets developers test it in real conditions and learn production-grade development scenarios.

Pre-requisites

Firstly, this tutorial assumes that you are comfortable working with the Linux CLI and have a basic knowledge of Linux commands, like cd, pwd, mv, cp, mkdir, touch etc.

I. Linux-based Operating System

We will use Ubuntu OS (an operating system built on the Linux kernel) on our local machine and remote host. You don’t need to know the specifics of Ubuntu OS (or Linux) in detail; I will cover everything required in this article.

Windows Subsystem Linux (WSL)

Windows Subsystem Linux (WSL) is a compatibility layer developed by Microsoft that allows users to run Linux distributions (simply Linux-based OS, like Ubuntu in our case) on their Windows machines. It provides nearly native Linux experience while letting the developers work from the Windows OS.

Installing Ubuntu on Windows using WSL

Step-1: Open Windows Powershell as administrator and run wsl —install .

Step-2: Open Microsoft Store and install Ubuntu.

Step-3: Open Ubuntu from the Start menu. Create a username & password for the Ubuntu configuration to be used in this Linux environment in future (if needed).

Note: In the entire article, the term “terminal“ refers to the Linux terminal, specifically the Ubuntu OS terminal. Although you can theoretically use any terminal of your choice (that supports Linux commands), it is better to stay on the same page for the sake of this article.

II. Virtual Private Server (VPS)

What is a VPS?

A Virtual Private Server (VPS, also called a remote host or a remote server) is a part of a dedicated server with some resources of its own. In simple terms, a physical server (at a data center) is virtually partitioned into multiple virtual servers (called a VPS instance), each with its own CPU, RAM, and storage. Each VPS instance operates independently of the other VPS instances of the physical server. VPS is a cost-effective alternative to dedicated servers.

Buying a VPS

Head over to any hosting provider (AWS, Digital Ocean, Hetzner, Hostinger, etc.) and buy any entry-level VPS hosting with low resources to save costs.

In this article, I’ll be using the KVM-1 VPS by Hostinger. Click here for a short tutorial on how to buy a VPS on Hostinger. The process remains the same for all other providers.

Access the VPS

After purchasing a VPS, you must access it from your local machine. There are different ways to access a VPS, but we will focus on the most common: SSH or Secure Shell.

Secure Shell (SSH)

Simply put, SSH is a network protocol (set of rules) that allows two computers to connect securely over an unsecured network. Here are some key features of SSH:

1. Secure authentication methods: via public-private key pairs or password-based logins. (We’ll see them in action later in this article!)

2. Secure file transfers: it can be used with tools like SCP (Secure Copy Protocol) to securely transfer files from the local machine to the remote host. (Again, we will use SCP later in this article).

SSH into the VPS using the Root Password

If you buy a VPS from any previously mentioned providers, you will most likely get one with “root login” enabled (except for AWS EC2).

What is root login in a VPS?

Root login means you will have all the administrative permissions for that VPS and can change the server configurations, files, and services.

Head over to your VPS provider's control panel (or dashboard) and get the following details about your VPS: IP Address, username, and password. For Hostinger’s KVM server, this is where you can find these details.

1. Open the terminal (for Windows users, open the Ubuntu from the Start Menu) and run the following command: ssh username@hostIPaddress (Replace username & hostIPaddress with those in your VPS control panel*).*

2. Enter the root password when asked, and you will be logged into the VPS Linux terminal.

   Note: While you type the password, it will not be visible on the screen for privacy reasons. You have to type it correctly and responsibly.

3. After SSH-ing into the VPS (that is, after entering into the VPS), the terminal will look something like this:

   

Don’t get overwhelmed by the terminal screen. It just shows the resources that the VPS is using, its public IP Address, and some links to the Ubuntu documentations - that’s all!

For now, exit the connection to the VPS by typing exit in the terminal. You will get back to the terminal screen of your local machine.

Let us understand a few other things before working on the VPS again.

SSH Key

An SSH Key is a cryptographic pair of public and private keys that are used to securely access a server without using the passwords. The public key is stored on the server, and the private key is stored securely on the user's local machine (or the VPS administrator).

Why need an SSH Key when we have password-based VPS access?

Password-based login poses certain security threats to the server, a few of them are listed below:

1. Users tend to choose small passwords that are easy to remember and even easier to guess. Therefore, passwords are more prone to phishing attacks.

2. Passwords are generally weaker than encrypted keys (SSH Keys, which we’ll see in the next section) and can easily be compromised.

Authentication via an SSH Key has some obvious benefits over password-based authentication:

1. You don’t have to remember the password or repeatedly type it whenever you access the remote server.

2. Unlike passwords (that can be guessed easily), SSH Keys, on the other hand, use strong cryptographic algorithms and are way safer than passwords.

Create an SSH Key

Follow the given steps to create an SSH Key pair for your VPS:

1. Open the terminal (remember to exit the VPS connection as instructed above) and run the following command:

    ssh-keygen -t ed25519 -C "your_email@example.com"
   

   On a high level, this command generates an SSH key pair using a highly secure Ed25519 cryptographic algorithm (-t flag). Your email is added as a comment (-C flag) for easy distinction in case you have multiple SSH keys in the future (you surely will!)

2. The terminal will prompt you to a default location to save your key pair. Since you are generating a key pair for the first time, simply press enter.

If you wish, you can change the location or filename but then you will have to remember them all the time. If you created SSH keys previously, ssh-keygen may ask you to rewrite another key, in which case we recommend creating a custom-named SSH key.

In such a case replace the `FILENAME` with your custom file name.

> Enter a file in which to save the key (/home/YOU/.ssh/id_ALGORITHM): /home/YOU/.ssh/custom_key_name

3. Finally, it will prompt you to type a passphrase. You can leave it empty by pressing ENTER.

You can see all the SSH keys stored in your machine by navigating to the /home/YOU/.ssh directory and typing ls

You will see the key pair that was generated just now (default name id_ed25519 or your custom name). The key with .pub extension is the public key, which will reside on the VPS to establish a secure connection between the VPS and the local machine.

4. Run the following command on the terminal to copy the public SSH key into the VPS.

ssh-copy-id -i "~/.ssh/id_ed25519.pub" username@hostIPaddress

# Remember that the default name for the SSH key will be id_ed25519 unless you change anything while creating the key
# Write the appropriate username and IP Address

It might be possible that ssh-copy-id is not installed in your system. If that is the case:

1. Run sudo apt update && sudo apt install openssh-client to install openssh-client.

2. Run command -v ssh-copy-id and confirm if the CLI returns something.

Congrats! ssh-copy-id is now successfully installed and you can now repeat Step-4 above to copy your SSH Key (Public) to the VPS.

SSH into the VPS using SSH Key

Now that we have configured the SSH Key on the local machine and the VPS, we can now access the VPS passwordless:

ssh -i "~/.ssh/id_ed25519.pub" username@hostIPaddress

# If the filename is kept to default, then the following command will also work
ssh username@hostIPaddress

Now that we have enabled SSH Key-based login in our VPS, the next step would be to disable password-based login in the VPS.

Disable Password Login

We disable password-login in the VPS by changing a few configurations:

1. SSH into the server.

2. Run nano /etc/ssh/sshd_config and the sshd_config file will open in the nano-editor (a simple CLI-based editor).

3. Locate PasswordAuthentication yes and set it to PasswordAuthentication no

4. Press CTRL + X, then Y and then ENTER to save and exit the file.

5. Run cd /etc/ssh/sshd_config.d/ directory and locate a *.conf file (the name could go something like 50-cloud-init.conf or similar)

6. Again locate PasswordAuthentication yes and set it to PasswordAuthentication no

7. Again, press CTRL + X, then Y and then ENTER to save and exit the file.

8. Run service ssh restart to restart the SSH service so that the changes can apply.

Create a non-root user

Why create a non-root user at all?

Although most VPS come with root access (except AWS EC2), operating the server with root-level privileges is generally not recommended. Here are a few reasons why:

1. Most brute-force hacking attacks on a server occur on the root username.

2. It is easy to destroy the entire server system if someone gains root access.

A non-root user (also called a sudo group user) provides improved security as the attacker must guess the correct sudo username to enter the system. Moreover, a sudo user has restricted access to the commands in the server.

A sudo user can perform root-level operations by using the sudo keyword before the command. This is still better than operating as a root user because:

1. It can save the server from unintentional damage as it is compulsory to write sudo before every root-level command (therefore, it makes the user think of every action being performed).

2. Every time a command is prefixed with sudo, it is logged into the server and the specific sudo-user can be tracked down in case of any mistakes.

Steps to create a non-root user

Follow the given steps to create a non-root user in your VPS:

1. SSH into the VPS as root

    ssh root@hostIPaddress
   

2. Create a new user

   Enter a password of your choice and remember it.

    adduser nonRootUserName
    # Replace nonRootUserName with a username of your choice
   

3. Add the non-root user to the sudo group

    usermod -aG sudo nonRootUserName
   

4. Switch to the new user

    su - nonRootUserName
   

Enable SSH access to the non-root user

Follow the given steps to enable SSH access to the non-root user:

1. Switch to the new user using su - nonRootUserName

2. Create an SSH directory & change its permissions

    mkdir -p ~/.ssh
    sudo chmod 700 ~/.ssh   # try running this command without the `sudo` keyword
   

   chmod command changes the permissions of the .ssh directory and 700 means the owner (i.e., nonRootUserName) has permission to read, write & execute. All other groups and users have no permissions and cannot do anything with the .ssh directory

3. Copy the public SSH key from the root .ssh folder

    sudo cp /root/.ssh/authorized_keys ~/.ssh/
    # Run `cat ~/.ssh/authorized_keys` command to see the content inside the copied file
   

   cp <source_path> <destination_path> command is used to copy files and cat <file_path> command is used to view the contents inside a file.

4. Change the permissions of the authorized_keys file & ownership of .ssh directory

    sudo chmod 600 ~/.ssh/authorized_keys
    sudo chown -R nonRootUserName:nonRootUserName ~/.ssh
   

   1. chmod 600 means the owner has permission to read and write only (no execution).

   2. chown nonRootUserName:nonRootUserName ~/.ssh means change the ownership of the .ssh folder to nonRootUserName user.

      Run ls -la ~/ to see the ownership of the .ssh folder

      

5. Open a new terminal and try accessing the VPS using the non-root username

    ssh nonRootUserName@hostIPaddress
   

Disable Root Login

After disabling the root login, you will not be able to SSH into the VPS using ssh root@hostIPaddress anymore. The only way to access the VPS will be through the non-root user.

Follow the given steps to disable root login in your server.

1. SSH into the server using root

    ssh root@hostIPaddress
   

2. Open the sshd_config file & change PermitRootLogin yes to PermitRootLogin no

    nano /etc/ssh/sshd_config
   

3. Save & exit (CTRL+X, then Y, then ENTER)

4. Restart the SSH service

    service ssh restart
   

5. Open a new terminal and try accessing the VPS using the root (It will throw an error!)

    ssh root@hostIPaddress
   
    # The terminal will throw an error
    > Permission denied (publickey)
   

Set up & secure the server

Update the server

Updating and upgrading the OS packages and services must be the first step whenever you log into the VPS system.

You can use apt (Advanced Package Tool) to install dependencies and packages in your VPS.

apt (Advanced Package Tool) is a CLI-based package manager for Linux-based distributions like Ubuntu. It helps users install, update, upgrade, and remove software packages efficiently.

sudo apt update && sudo apt upgrade

Difference between sudo apt update and sudo apt upgrade?

The VPS system keeps a list of available packages and their versions in an index.

sudo apt update looks for all the packages whose newer versions are available and updates the local package index, but does not install them.

sudo apt upgrade looks at the local package index and installs the newer versions of the packages already installed in the VPS while keeping the older versions (to avoid breaking any dependency).

Protection from brute-force login attacks

You can set up a service to prevent brute-force login attempts from attackers. Fail2Ban is a service that monitors login attempts and bans IPs that fail multiple login attempts in a short span of time.

Follow the given steps to install and configure Fail2Ban:

1. Install fail2ban

    sudo apt install fail2ban -y
   

2. Create a local configuration file

    cp /etc/fail2ban/jail.conf /etc/fail2ban/jail.local
   

3. Edit the local configuration file

    sudo nano /etc/fail2ban/jail.local
   

   Modify the [sshd] section

    [sshd]
    enabled = true
    port = 22
    maxretry = 5
    bantime = 3600
   

   maxretry = 5: A maximum of 5 failed login attempts will be allowed

   bantime = 3600: After 5 failed login attempts, the IP will be banned for 3600 seconds (1 hour)

4. Restart the service

    sudo service fail2ban restart
   

You can view the banned IPs by running sudo fail2ban-client status sshd command.

Conclusion

In this article, we learned how to configure a VPS from scratch properly and set it up to deploy our applications securely. We covered server access, root-level access, SSH keys, creating users, and adding them to groups, along with some best practices for protecting a server from brute-force attacks. Although this article contains much information, it only scratches the surface.

Next steps

Although fairly detailed, this article is not exhaustive. There are many other things a server administrator can do (and should do) to secure a server from phishing and hacking attacks. I would suggest you read about the following topics to strengthen your server administration skills:

1. Setting up firewalls and restricting ports:

   A firewall acts as a shield and blocks unauthorized access to the VPS by blocking or allowing specific ports only

2. Restricting the root-level commands for the sudoers:
   A sudoer (non-root sudo group user) can technically do all root-level operations using the sudo keyword. So, it becomes critical to restrict and specify the root-level commands for the sudoers.

3. Setting up 2FA (Two Factor Authentication) for more secure access to the VPS:
   Even if an attacker gets hold of your SSH key (by compromising your local machine) and tries to access the VPS, they can not do so if a two-factor authentication is set up in the VPS.

Final thoughts

Although they might feel overwhelming for a beginner developer, server configuration and security are necessary and must-have skills for every developer looking to deploy secure and scalable applications online.

I hope this article was able to teach you something.

Hello World!

Flutter is an open-source UI software development toolkit created by Google; it is a rapidly growing framework for cross-platform development. Cross-platform development means developing apps for mobile devices, desktops, and the web from a single codebase.

Flutter uses the Dart programming language under the hood. In this beginner-friendly blog, we will learn the fundamentals of the Dart programming language. We will be covering a brief history of Dart, and then move directly to data types and keywords provided by Dart.

Why was Dart created in the first place?

Dart was unveiled in 2011. It was designed with a focus on improving web development by addressing limitations in JavaScript. Dart aimed to offer a more structured and efficient alternative for building complex, large-scale web applications compared to JavaScript, which is dynamically typed, lacks certain features and often poses challenges for developers working on ambitious projects (However, JavaScript is still the most widely used language for web development in the world).

Dart shines prominently in frontend development, particularly with the Flutter framework, which utilizes Dart to build natively compiled mobile, web, and desktop applications from a single codebase.

However, Dart is not limited to front-end development. It can also be used for backend development through frameworks like Aqueduct to create RESTful APIs and handle complex backend logic. This allows developers to build full-stack applications using Dart.

What is unique about Dart?

Let us look at some of Dart's characteristics in the following section.

Object-Oriented

Dart is an object-oriented programming (OOP) language. But what exactly is an object-oriented programming (OOP) language? Well, it is a programming language that supports the creation of objects- data structures with data fields (simply variables) and methods (also called functions) to build applications.

Dart powers Flutter (which might be why you're learning Dart, right?), and the entire Flutter framework is based on OOP principles like Inheritance, Abstraction, Polymorphism, and Encapsulation.

Note: If you are getting introduced to the above-stated terms for the first time, simply leave it (No Worries!). Just keep in mind that OOP languages allow us to create objects (What are objects? We'll see later). Object-oriented programming is an entirely different topic on its own; we might cover it in a different article.

Static type system

Dart is a statically typed programming language, which means that Dart ensures that the values of variables match their static types (data types defined at the time of writing code). This feature is called type-safety or sound-typing. Type safety is one of the most critical features of Dart.

Note: People from web development backgrounds can think of this feature as the same as TypeScript, as JavaScript is dynamically typed (that means the data type of a variable is not fixed; it can change at any time inside the code without the compiler giving any errors).

Sound Null Safety

In Dart, variables can never be null unless the developer says they can be. This can help avoid null exceptions that might occur at runtime. This is how we can declare a null variable.

/* '?' indicates that although the variable 'num' is an integer, but
it can also be null */
int? num;
int nonNullNum; // this variable must always be an integer

Note: JavaScript has no built-in mechanisms to check for null variables. Hence, the developers need to be very careful while dealing with null in JavaScript (this was another reason for the introduction of TypeScript in web development).

In the following sections, we will learn about some common data types in Dart, which you might have seen in other programming languages, primarily JavaScript (too many similarities, Huh!)

Data types in Dart

Preliminary Note: Everything in Dart is an object. You might not know what an object is, and it is completely fine. Objects are not in the scope of this article. Just remember that there is some super-set called an object that encompasses everything else in Dart (even functions).

Dart supports many data types similar to other programming languages, such as integers, strings, and booleans. However, Dart also provides unique data types like records, maps, lists, and sets. We will look at all of these in detail.

Note: The syntax to declare any variable (something that stores data) is dataType variableName = variableValue

Primitive data types in Dart

Below are the primitive datatypes provided by Dart. All of these are self-explanatory; hence, we won't be going into their details (The exciting stuff comes after this!).

1. int : Store numbers no larger than 64 bits

2. double : Stores 64-bit floating point numbers

3. bool : Stores boolean values (either true or false)

4. String : Stores strings (in double quotes or single quotes)

    int number = 100; // integer
    double weight = 108.10; // double
    bool isCitizenOfIndia = true; // boolean
    // Both are valid strings
    String nameWithDoubleQuotes = "Abhijeet";
    String nameWithSingleQuotes = 'Abhijeet';
   

Note: Did you notice that the String datatype starts with a capital letter, whereas other datatypes start with a small letter? That's just how Dart was designed, and we cannot do anything about it. Try to remember it.

Collections in Dart

Besides the commonly used data types, Dart also offers collections. "Collections" is a general term that refers to data types (or technically data structures) that store a group of related data together.

Lists

Just like other programming languages have arrays, Dart has lists, which store data in a sequence.

// Syntax: List <another_datatype> listName = [];
List<String> listOfCities = ["New York", "New Delhi", "Boston"];
List<int> listOfMarks = [23, 45, 90];
List<double> listOfHeights = [100.9, 23.45, 32.109];

We can create a list of any fundamental/primitive or derived data type. For example, we can have a list of list of strings.

List<List<String>> names = [
    ["Abhijeet"],
    ["Abhishek", "Kumar", "Gupta"],
    ["John", "Doe"],
];

We can also create a list consisting of different data types together. Remember, I told you earlier that everything in Dart is an object.

List<Object> everything = ["fskhg",true,235, 78.0];

Sets

Need a data structure that stores unique data only? Dart has got you Sets. A set in Dart is an unordered collection of unique items.

Set<int> numbers = {23,45,6,50,10}; // Stores only unique values
List<int> numbers2 = [23, 34, 23, 10]; // Can store duplicate values

Maps

Maps are collections (or data structures if you wish to call it that) that store data in key-value pairs. Both the keys and values can be of any type.

// Syntax: Map<data_type1, data_type2> mapName = {};

// A map of Strings and integers
Map<String, int> studentMarks = {
    "Smith" : 89,
    "Abhijeet" : 94,
    "Alizeh" : 78
};

// A map of integers and booleans
Map<int, bool> isEven = {
    2 : true,
    5 : false,
    11 : false
};

Note: Lists are declared using square brackets ([]) whereas Maps and Sets are declared using curly braces ({}).

Dart provides more data types, such as Runes and Symbols, but they are pretty uncommon and very specific; therefore, they are not covered here. Moreover, there is something called Records in Dart versions beyond 3.0, but they are not covered here to keep this article beginner-friendly.

Declaring variables in Dart

Declaring a variable is pretty straightforward; you have done it a thousand times. Just put a keyword (usually the data type) followed by the variable name.

// Syntax to declare a variable => keyword/data-type variableName;
int number;
String name;

However, it is not always necessary to define the variable's data type beforehand; sometimes, the developers find it more practical and valuable to have the Dart system (or compiler) infer the data type during the run time. Dart provides specific keywords for this, and we will look into each in the following section.

Keywords in Dart

var

The var keyword is used when the data stored in the variable can take any potential value. The Dart compiler infers (understands on its own) the data type during compile time (when the code is being compiled). This means that the variable type gets fixed when its value is assigned.

var anything = 10; // Data type of "anything" is integer
anything = "Abhijeet"; // This will give an Error
// Data type once inferred by the compiler cannot change now

Note: People coming from the JavaScript background might get confused here. Let me clear up the confusion.
var keyword in JavaScript gives dynamic type to the variable, which is checked during the runtime (and not during compile time). So, we can change the type of data stored in the variable without errors.
However, var keyword in Dart works a little differently; the data type cannot be changed later if the compiler has inferred it once.

// IN JAVASCRIPT
// variables declared using `var` keyword can change their datatype 
var name = 10; // datatype is integer
name = "Abhijeet"; // datatype is now string

// IN DART
// variables declared using `var` keyword can't change their datatype
var name = 10; // datatype inferred by the compiler as integer
name = "Abhijeet"; // ERROR: A value of type String cannot be 
// assigned to a variable of type integer

dynamic

The dynamic keyword stores data with dynamic typing. This means that the type of data being stored in the variable is inferred during the run time (when the dart program is run after being compiled).

This is similar to the var keyword of JavaScript.

// In Dart, variables declared using `dynamic` keyword can change 
// their datatypes at any later stage in the code

dynamic name = 10; // datatype is integer
name = "Abhijeet"; // datatype is now String
name = ['new york', 'boston']; // datatype is now List<String>
name = ["Abhijeet", 23]; // datatype is now List<dynamic>

Note: Evidently, the dynamic keyword contradicts Dart's type-safety feature. Therefore, you should avoid using the dynamic keyword wherever possible.

The difference between dynamic and var

The only similarity between var and dynamic is that the values stored in variables declared using both these keywords can be changed at any later stage in the code. Let us talk about the differences between the two.

var
The data type is checked during the compile time.
The data type cannot be changed later on.

dynamic
The data type is checked during the run time.
The data type can be changed later on.

final

The final keyword can hold any value, but it must not be changed later. The data stored in a final variable cannot be changed (hence the term "constant"). The data type is inferred at the runtime.

final name = "Abhijeet"; // datatype inferred as String
name = "Shanaya"; // ERROR: A final variable can only be set once
name = 10; // ERROR: A value of type integer cannot be assigned
// to a variable of type String

final names = ["Abhi","John"]; // datatype inferred List<String>
final list = ["Abhijeet", true]; // datatype inferred List<Object>

The more practical use of final variables is to store runtime constants. A runtime constant is a constant value known while the program is running. For instance, some runtime constants are the current date or the response from an external API.

final date = DateTime.now(); // Gives the current date
final response =  await getWeatherData(); // Gives current weather
// from an external API

/* Note: If you do not understand the `await` keyword here, Just 
ignore it. It is used when dealing with asynchronous operations
(more on it in some other article) */

const

Just like the final keyword, the const keyword is also used to store values that cannot be changed later. The data type is inferred at the compile time (just like var), and hence, any constant that is not a compile-time constant cannot be assigned to a const variable. For instance, API responses and current dates are not compile-time constants.

const name = "Abhijeet"; // datatype inferred as String
name = "Shanaya"; // ERROR: A const variable can only be set once
name = 10; // ERROR: A value of type integer cannot be assigned
// to a variable of type String

const list = ["Abhijeet", true, 34]; // type inferred List<Object>

const date = DateTime.now(); // ERROR: Const variables must be 
// initialized with a constant value

The difference between final and const

The following comparison lists some similarities as well as differences between the final and the const keywords.

final
Value, once assigned, cannot be changed.
Datatype is inferred at the runtime.
It can store runtime constants such as API responses and current dates.

const
Value, once assigned, cannot be changed.
Datatype is inferred at the compile-time.
It can only store data that is constant at the compile-time.
A const variable must be initialized with a value.

Note: Remember that API responses are always handled using the keyword when handling asynchronous operations (Futures in Dart, similar to promises in JavaScript). And use the const keyword to assign constant values to a variable.

You can also specify the type while using the final and const keywords to avoid the type inference.

final String name = "Abhijeet";
const double grade = 7.54;

final List<int> list = [2,3,4,5];
const List<String> names = ["Abhijeet", "Anshika"];

final List<Object> anything = ["Abhijeet", true, 45.8, 455];
const List<Object> anything2 = ["Anshika", false, 95.8, 476];

Conclusion

In this introductory article, we delved into the basics of Dart programming. We explored Dart's object-oriented nature, its crucial role in powering Flutter, and key features such as static type system and sound null safety. Along with the standard data types, such as Lists, Sets, and Maps, providing a brief overview, the article also elucidated variable declaration using keywords like var, dynamic, final, and const, focusing on clarifying the distinctions between these for beginners.

In conclusion, I hope this article served as a concise foundation for beginners and set the stage for more in-depth exploration in future series installments.

Resources to Learn more

You can refer to the following resources to learn more about the Dart programming basics and practice the basic syntax and other concepts.

• Dart official documentation

• DartPad: To practice writing Dart code without any local setup

I will see you at the next one.
Till then, Goodbye.

Are you tired of constantly logging in and out of your chatGPT account? Say no more! In this blog, I'll show you how to create a personal AI assistant mobile application with Flutter and the OpenAI API.

Not only will you be able to add an exciting project to your mobile development portfolio, but you'll also be able to flaunt your new AI-assistant application to your friends. So, let's learn how to build an innovative and practical mobile application that will take your development skills to the next level.

Getting the environment ready

Open your terminal and run:

flutter create <project_name> org com.<your_name>.<project_name>

NOTE: <project_name> and <your_name> are placeholders, and you have to write your project name and your own name, respectively (Make sure to remove the < >).

Now, run flutter run to run the project on your device/simulator/web.

Adding custom fonts and assets

Let us add custom fonts, assets, and env files to our project.

1. Create an assets folder in the root directory of the project. The assets folder consists of two other folders - fonts & images

2. Add .otf files of any font of your choice in the fonts folder. Similarly, add any icons or images of your choice in the images folder.

3. Open the pubspec.yaml file and copy the following code under the flutter package section.

flutter:
  uses-material-design: true
  assets:
    - assets/images/
    - .env
  fonts:
    - family: Cera Pro
      fonts:
        - asset: assets/fonts/Cera-Pro-Bold.otf
        - asset: assets/fonts/Cera-Pro-Medium.otf

NOTE-1: You must take care of the indentation.

NOTE-2: Every time you make any changes to pubspec.yaml file, always run flutter pub get command.

Creating the Color Palette

Let's create a file inside the lib folder containing all the colors we'll use throughout the project. A benefit of creating a separate file for such purposes is that we'll have to do it only once whenever we change the colors in the future.

import 'package:flutter/material.dart';

class Pallete {
  static const Color borderColor = Color.fromRGBO(200, 200, 200, 1);
  static const Color whiteColor = Colors.white;
  static const Color textFieldColor = Color.fromRGBO(52, 53, 65, 1);
  static const Color textBoxColor = Color.fromRGBO(65, 65, 78, 1);
  static const Color primaryColor = Color.fromRGBO(24, 201, 245, 1);
  static const Color chatColor = Color.fromRGBO(68, 70, 84, 1);
  static const Color appBarColor = Color.fromRGBO(32, 33, 35, 1);
}

Let's start

Now that we have installed all the necessary dependencies and packages, let us start with the real stuff - coding our app. I will be explaining the code and its logic. However, I assume that the implementation of basic UI using Flutter is known to you, so I will skip explaining those portions.

We will work inside the lib folder throughout our project.

main.dart

Pretty customary section! This file contains the MyApp widget.

import 'package:flutter/material.dart';
import 'package:flutter_dotenv/flutter_dotenv.dart';
import 'package:jarvis/homepage.dart';
import 'package:jarvis/pallete.dart';

// the main function is made async. This enables us to use await keyword with dotenv inside.
Future<void> main() async {
  await dotenv.load(); // loads all the environment variables
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      title: 'Jarvis',
      theme: ThemeData.light(useMaterial3: true).copyWith(
        scaffoldBackgroundColor: Pallete.whiteColor,
        appBarTheme: const AppBarTheme(
          backgroundColor: Pallete.whiteColor,
        ),
      ),
      home: const HomePage(),
    );
  }
}

Homepage widget

We will use the Homepage widget to set up the app bar only. The rest of the sections will be dealt with later.

import 'package:flutter/material.dart';
import 'package:jarvis/chat_section.dart'; // ChatSection
import 'package:jarvis/pallete.dart'; // Color Pallete

class HomePage extends StatefulWidget {
  const HomePage({super.key});

  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Pallete.appBarColor,
        elevation: 2,
        title: const Text(
          'J  A  R  V  I  S',
          style: TextStyle(
            fontSize: 18,
            color: Colors.white,
            fontWeight: FontWeight.w500,
            fontFamily: "Cera Pro", //make sure to add custom fonts to pubspec.yaml
          ),
        ),
        centerTitle: true,
      ),
      body: Container(
        decoration: const BoxDecoration(
          color: Pallete.chatColor,
        ),
        child: const ChatSection(), // widget explained below
      ),
    );
  }
}

ChatSection widget

The chat section will contain the entire UI of our app. The code will be pretty simple (as the most exciting part comes after this).

NOTE: The ChatSection widget will be stateful.

import 'package:flutter/material.dart'; // material package
import 'package:jarvis/open_ai_service.dart'; // OpenAiService class
import 'package:jarvis/pallete.dart'; // Pallet containing colors

class ChatSection extends StatefulWidget {
  const ChatSection({super.key});

  @override
  State<ChatSection> createState() => _ChatSectionState();
}

class _ChatSectionState extends State<ChatSection> {
  // to control the text input field (i.e. access the value input by user)
  TextEditingController promptController = TextEditingController();

  String prompt = ''; // stores the user prompt
  String chatSpeech = ''; // stores the response from the API

  bool showLoader = false; // whether to show loader or not

  // define class openAiService (type of class = OpenAiService) 
  final OpenAiService openAiService = OpenAiService();

  @override
  void dispose() {
    promptController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Column(
        children: [
            // chatGPT Response Container (explained below)
            // Prompt Input Section (explained below)
        ]
    );
  }
}

We will have the following two sections in the ChatSection widget.

1. ChatGPT Response Section

2. Prompt Input Section

Prompt Input Section

Let's start with the interesting one, the Prompt Input Section. Most of the code will be for the UI, so there is not much to explain there; hence, look at the code directly.

        // Prompt Input section
        Container(
          height: MediaQuery.of(context).size.height * 0.12,
          decoration: const BoxDecoration(
            color: Pallete.textFieldColor,
            borderRadius: BorderRadius.only(
              topLeft: Radius.circular(
                0,
              ),
              topRight: Radius.circular(
                0,
              ),
            ),
          ),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            crossAxisAlignment: CrossAxisAlignment.center,
            mainAxisSize: MainAxisSize.max,
            children: [
              //Input text field
              Expanded(
                child: Container(
                  // width: MediaQuery.of(context).size.width * 0.8,
                  padding: const EdgeInsets.all(8),
                  child: TextField(
                    cursorColor: Colors.grey,
                    cursorHeight: 30,
                    controller: promptController,
                    autocorrect: true,
                    autofocus: true,
                    // maxLength: 200,
                    maxLines: null,
                    keyboardType: TextInputType.multiline,
                    style: const TextStyle(
                      color: Colors.white,
                      fontFamily: "Cera Pro",// make sure to add custom fonts to pubspec.yaml
                    ),
                    decoration: InputDecoration(
                      border: OutlineInputBorder(
                        borderRadius: BorderRadius.circular(7),
                        borderSide: BorderSide.none,
                      ),
                      filled: true,
                      fillColor: Pallete.textBoxColor,
                      hintStyle: const TextStyle(
                        color: Colors.grey,
                      ),
                      hintText: 'Give me a prompt...',
                    ),
                  ),
                ),
              ),

              // Send Button
              IconButton(
                onPressed: ()=>{}, // code explained below
                icon: const Icon(
                  Icons.send,
                  color: Pallete.primaryColor,
                  size: 26,
                ),
              ),
            ],
          ),
        )

Let's focus our attention on the onPressed property of the IconButton widget.

When the Send button is pressed, a function is called to post the prompt to the OpenAI API and fetch the response. A loader will be displayed on the response container until the API returns the response. So, the following events take place when send button is pressed.

1. The value of the input text field is stored in the prompt variable. The state of prompt is modified.

2. The prompt is passed as an argument to the chatGPTApi method of the openAiService class. The chatGPTApi() method is an async function (returning a Future), so the result is awaited using the await keyword.

3. The API response is stored in a speech variable.

// Write this block of code in the 'onPressed' field of IconButton widget.

onPressed: () async {
                  setState(
                    () {
                      prompt = promptController.value.text.toString();
                      showLoader = true;
                    },
                  );
                  final speech = await openAiService.chatGPTApi(prompt);
                  setState(() {
                    chatSpeech = speech;
                    showLoader = false;
                  });
                  // print(speech);
                  promptController.clear();
                },

ChatGPT Response Section

This section will be the just UI. Besides, some things to note.

1. This section will be wrapped inside the Expanded widget, as we want this section to take up all the space available.

2. This section needs to be scrollable, so wrap it in SingleChildScrollView widget.

3. If the isShowLoader is true, then show a loader. Otherwise, check for the value of the speech variable; if empty, display some introductory message. Else, display the response returned by the API.

The following is the code for this section (Don't worry if it seems long!! It's just FLUTTER UI).

// chatGPT response container
Expanded(
  child: SingleChildScrollView(
    child: Align(
      alignment: Alignment.topLeft,
      //chatGPT response chat bubble
      child: showLoader == true
          ? const Center(
              child: Padding(
                padding: EdgeInsets.only(
                  top: 30.0,
                ),
                child: CircularProgressIndicator(
                  color: Pallete.primaryColor,
                ),
              ),
            )
          // Main content
          : Row(
              mainAxisAlignment: MainAxisAlignment.center,
              crossAxisAlignment: CrossAxisAlignment.start,
              mainAxisSize: MainAxisSize.max,
              children: [
                // small icon of a robot/assistant 
                Padding(
                  padding: const EdgeInsets.only(
                    top: 15.0,
                  ),
                  child: Image.asset(
                    "path_to_any_icon_of_your_choice",
                    width: 40,
                  ),
                ),
                // Response Box
                Expanded(
                  child: Container(
                    margin: const EdgeInsets.symmetric(
                      horizontal: 10,
                      vertical: 20,
                    ),
                    padding: const EdgeInsets.all(10),
                    decoration: BoxDecoration(
                      border: Border.all(
                        color: Pallete.borderColor,
                      ),
                      borderRadius: BorderRadius.circular(10),
                    ),
                    child: Text(
                      chatSpeech == ""
                          ? "HEY ! How may I help you?"
                          : chatSpeech,
                      style: const TextStyle(
                        color: Pallete.borderColor,
                        fontFamily: "Cera Pro",
                      ),
                    ),
                  ),
                ),
              ],
            ),
    ),
  ),
),

Creating OpenAiService

Let's work on the open_ai_service.dart file, which is the most critical file in our project. This file would contain methods to post queries and receive responses from the OpenAI API.

Firstly, install all the packages and modules required for further coding. We'll need the http package (to interact with OpenAI API) and the dot_env package (to access the environment variables). Navigate to your project directory and run the following commands on your terminal.

flutter pub add http
flutter pub add dot_env
flutter pub get

.env

Environment variables are the ones that store sensitive data (something which must not be publicly visible). Here, we will store our private API key as an environment variable. Create a .env file in the root directory of your Flutter project and define the API key as an environment variable.

OPEN_AI_API_KEY = "paste your API key here"

NOTE: Make sure that you include the .env file in .gitignore before pushing your code to GitHub (or a similar platform).

The request/response structure of OpenAI API

Firstly, sign up for an OpenAI account and generate a free API key.

Head over to the API reference section of the OpenAI website and look for the Chat section. This model generates responses based on a conversation (i.e., it remembers the chats).

You can see the example request and response shown in the documentation. The structure of the HTTP-post request will look like this.

// structure of the API request (in dart code)
http.post(
    Uri.parse("https://api.openai.com/v1/chat/completions"),
    headers:{
        "Content-Type": "application/json",
        "Authorization": "Bearer $openAIApiKey"
    },
    // the body needs to be converted to JSON format
    body: jsonEncode(
        {
            "model" : "gpt-3.5-turbo",
            "messages" : messages,
        },
    ),
);

The response from the API will look something like this.

// structure of API response body (in json format)
{
  "id": "chatcmpl-123",
  "object": "chat.completion",
  "created": 1677652288,
  "choices": [{
    "index": 0,
    "message": {
      "role": "assistant",
      "content": "\n\nHello there, how may I assist you today?",
    },
    "finish_reason": "stop"
  }],
  "usage": {
    "prompt_tokens": 9,
    "completion_tokens": 12,
    "total_tokens": 21
  }
}

Do not worry; we are interested only in the message field (under the choices property). Since the API response will be returned in JSON format, we must parse/decode it before using it.

Creating the OpenAiService class

Now we'll create the OpenAiService class and define the methods for posting requests to the OpenAI API.

import 'dart:convert'; // package to encode/decode JSON data type
import 'package:flutter_dotenv/flutter_dotenv.dart'; // dot_env package
import 'package:http/http.dart' as http; // http package

var openAIApiKey = dotenv.env['OPEN_AI_API_KEY']; //access the OPEN_AI_API_KEY from the .env file in the root directory

class OpenAiService{
    // declaring a messages List to maintain chat history
    final List<Map<String,String>> messages = [
        {
            "role" : "user",
            "content" : "Ensure all responses within 200         words",
        },
    ];

    // this async function with return a future which will resolve to a string
    Future<String> chatGPTApi(String prompt) async{
        // add the prompt to messages
        messages.add({
            "role" : "user",
            "content" : prompt,
        });

        // post the prompt to the API and receive response
        try{
            final res = http.post(
                Uri.parse("https://api.openai.com/v1/chat/completions"),
                headers:{
                    "Content-Type": "application/json",
                    "Authorization": "Bearer $openAIApiKey"
                },
                // encode the object to JSON
                body: jsonEncode(
                    {
                        "model" : "gpt-3.5-turbo",
                        "messages" : messages,
                    },
                ),
            );

            if(res.statusCode == 200){
                // decode the JSON response
                String response = jsonDecode(res.body)['choices'][0]['message']['content'];
                response = response.trim();
                // add the response to messages and return response
                messages.add(
                    {
                        "role" : "assistant",
                        "content" : response,
                    }
                );
                return response;        
            }
            else{
                return "OOPS! An Error occured. \n Please try again after sometime";
            }
        }
        catch (error){
            return error.toString();
        }
    }
}

Generating an apk file

To test the application on an Android device, we need to install the apk-file of our project. Open the terminal and run:

flutter build apk --release

The terminal will show you the exact path of the apk file. Transfer it to your mobile and test it.

NOTE: You might have to allow installation from unknown sources in your device settings to install the apk.

Conclusion

In this tutorial, we created a working mobile application using the OpenAI API to answer all our queries. We learned about making HTTP requests and using environment variables to store sensitive information like API keys. Also, we modularized our code by creating separate widgets.

I hope you enjoyed this tutorial & I was able to add value to your development journey through this blog. You can find the source code of this project here.

Do like and share this blog, and follow me for more such content.

See you at the next one !!