14 October 2021

App Development With Flutter And NodeJS PART-1

Written by Bhawani Shankar

Flutter, Full Stack Development, Nodejs flutter, full stack, nodejs 7 Comments

Hi,

You all know that nowadays there are many such apps which make our life easier or help to run our business and there are many other categories too. If you also want to make an app by yourself, then read this blog completely, you will get some ways through which you can learn to make an app.

What is an app?

We call the app an application for short. An app is something that gets installed in our electronic system(Android, Computer, IOS, IPAD) and we can open and use it anytime.

Types of app?

There are generally five types of apps

1. Web-based app

A web-based app is an application that requires internet access for complete use. These types of apps are coded in JavaScript, HTML5, or CSS. A web-based app typically requires a much smaller amount of memory space in a user’s device because the databases are stored on the Internet server. Examples of web-based apps include Netflix, Facebook, and Linkedin.

2. Native app

Apps that are created for a certain mobile platform are known as native applications. For example, an app that is made for an Apple iPhone will only be usable on Apple devices and would not work on other types of mobile phones, such as Android. These types of apps are primarily used to provide the highest performance on a particular mobile operating system. An example of a native app is the calculator application on the iPhone.

3. Hybrid app

A hybrid app is an app that is made to support both native and web-based technologies and is a combination of both web-based and native applications. These apps are easier and quicker to create and only use a single code base that can be integrated across various platforms. However, it’s important to note that hybrid apps often have a lower performance rate than native or web-based apps.

4. IWA app

IWA is short for installable Web apps. As its name suggests, it is also a Web application, and it is configured and deployed in the exact same way as the other Appeon Web application that runs in the Web browser (browser-based apps). Examples of IWA apps include YouTube Music.

5. Cross platform app

A cross-platform application is a mobile app that is compatible with multiple operating systems and can, therefore, run on any smartphone, tablet, PC, smartwatch, and connected TV. Platform-independent applications have multiple advantages: 70–90% reusable code. Easy maintenance and updates.

Flutter is used to develop cross-platform applications for Android, iOS, Linux, Mac, Windows, Google Fuchsia, and the web from a single codebase.

Requirements:

Computer or laptop with minimum 4gb ram
Internet
Any programming language

Steps:

Install nodejs
Visual Studio Code IDE
javascript programming language
nodejs
npm
knowledge of ip and ports
knowledge of protocols
api (Application Programming Interface)
knowledge of parser
headers in api
mongoose database
session authentication
jwt token
jwt token authentication
mvc modal or clean architecture
mongoose curd operation
mongoose complex operation
install flutter
dart programming language
flutter ui development
state management
modal mvc modal or clean architecture
api calls
memory leak
external packages
native plugin
logo change
package name change
release key generate
app release

1. Install NodeJS

First, you have to go to the official website of nodejs then download and install nodejs. now to verify the installation, open the terminal or command line and write this code on it.

node -v

If nodejs is installed in the system then it will tell which version it is and if it is not then it will tell something like node is not recognized as an internal command.

Node.js is an open-source, cross-platform, back-end JavaScript runtime environment that runs on the V8 engine and executes JavaScript code outside a web browser.

2. Visual Studio Code

Visual Studio Code is a source-code editor made by Microsoft for Windows, Linux, and macOS.

First, you have to install and learn how to run vs code. In this, you have to learn how to install extensions, write and run programs.

follow the below steps to run nodejs in your vs code.

You can create a folder anywhere by the name of nodejs-learning.

Now open vs code.

Install the prettier extension, This code will format your written code, so that your code looks good

Select the file from the menu, the option of the open folder will come in it, open the folder you just created

shortcut (ctr/cmd+k+o)

Now create a file named index.js here and write in it

console.log("Hello World");

Now to run this file, select Terminal from the menu and open a new terminal.

shortcut (ctr/cmd+`)

and in this terminal write

node index.js

OR

node index

OR

node .

Remember node . will work only if the name of your file is index.js else you would have written node filename.js or node filename

As soon as you type this and enter, you will see the output written Hello World.

3. NPM

npm is a package manager for the JavaScript programming language maintained by npm, Inc. npm is the default package manager for the JavaScript runtime environment Node.js. It consists of a command-line client, also called npm, and an online database of public and paid-for private packages called the npm registry.

So the above line simply means that you can install the package created by someone else or any open source community and use it from npm or upload your own package on npm so that others can also use it.

You don’t need to install npm CLI because when you install nodejs then npm CLI gets installed as well.

To install any package from npm CLI to the current directory you just need to write

npm install package-name

OR

npm i package-name

If you want to install a package globally so that you can use this package from anywhere in your system then you have to write

npm i package-name -g

To remove any package from npm CLI from the current directory you just need to write

npm remove package-name

OR

npm r package-name

If you want to remove a package globally then you have to write

npm r package-name -g

3. IP and Ports

IP stands for “Internet Protocol,” which is the set of rules governing the format of data sent via the internet or local network.

The internet needs a way to differentiate between different computers, routers, and websites. IP addresses provide a way of doing so and form an essential part of how the internet works.

There are two types of IP

IPv4
IPv6

I am not going to talk much about IP here as it will become a very big topic. I am just telling you that the work of making your app will continue.

Now you have understood that every electronic system has a different IP. So we can do the work of taking and giving information from that system with the help of IP and the same is the use of the internet.

Now here is a problem we have to run many services from one system like mail service, website, application and many more.

So now only to solve this problem, ports are used.

We can run and use different services from the same system on different ports.

We call Internet Protocol as IP in short form.

Protocol, in computer science, is a set of rules or procedures for transmitting data between electronic devices, such as computers. In order for computers to exchange information, there must be a preexisting agreement as to how the information will be structured and how each side will send and receive it. Without a protocol, a transmitting computer, for example, could be sending its data in 8-bit packets while the receiving computer might expect the data in 16-bit packets.

We use the HTTP or HTTPS protocol for web services. SMTP, POP3, IMAP, EXCHANGE for mail. There are many other protocols like this.

in https://bhawaniblog.in https is a protocol bhawaniblog.in is a domain that is connected to IP, meaning you can assume its value as something like 171.79.145.250. How it connects, you will understand all that in DNS (domain name system), do not take it now, let’s see later.

Usually, we use ipv4 address, It also has three categories

LOCAL IP: Local IP is the IP of your own system, which you can use only in your own system.

127.0.0.1

LAN IP: When you connect your system to a network by cabling or wifi, then you also have a LAN IP, from this IP you can take and give information from the same network meaning the device which is connected to the network from it.

A device on the same network may have this example LAN IP:

192.168.1.25

Another device on the same network may have this example LAN IP:

192.168.1.30

PUBLIC IP: A public IP address is an IP address that can be accessed directly over the internet and is assigned to your network router by your internet service provider (ISP). Your personal device also has a private IP that remains hidden when you connect to the internet through your router’s public IP.

There are also two types of LAP IP and PUBLIC IP

DYNAMIC IP: A dynamic IP address is an IP address that an ISP or Local Network lets you use temporarily. If a dynamic address is not in use, it can be automatically assigned to a different device. Dynamic IP addresses are assigned using either DHCP or PPPoE.

STATIC IP: This means it remains the same over time

That’s all, friends, we will start in the next part. I hope you liked it, share it if you liked it. part 2 I will create after the blog reaches 2000.

And if you want to become a software developer then join us.