Pages

Monday, October 28, 2024

Guide to Setting Up Airbase on Windows, The fastest, easiest way to deploy applications to the Government Commercial Cloud.

Guide to Setting Up Airbase on Windows

Airbase is a CLI tool designed to simplify deployments. Although the Airbase documentation often assumes a Linux or Mac environment, you can easily adapt the instructions for Windows. Below is a step-by-step guide to help you get started with Airbase on a Windows computer.

Step 1: Install Node.js and npm

Make sure you have Node.js and npm (Node Package Manager) installed on your computer, as Airbase requires them. If you haven't installed Node.js yet, you can download it from nodejs.org.

To verify the installation, open the Command Prompt and type:

bash
node -v npm -v

Step 2: Install the Airbase CLI

Airbase installation commands in Linux use sudo, but on Windows, you don't need it. Run the following command in Command Prompt:

bash
npm install --global @airbase/airbase-cli

If you encounter any warnings during installation, they can generally be ignored unless they prevent the installation. After installation, check if the installation was successful:

bash
airbase --version

Step 3: Log in to Airbase

To configure your Airbase credentials, log in using:

bash
airbase login

This will prompt you to open a URL in your browser to authorize the login. Visit the URL, log in, and follow the on-screen instructions. Once you've authorized, the configuration file (.airbaserc) will be created in your user directory.

Step 4: Clone a Template Project

If you want to start with a ready-made project, you can clone an existing template from GitHub. For example:

bash
git clone https://github.com/GovTechSG/template-nextjs-helloworld.git

Navigate to the project directory:

bash
cd template-nextjs-helloworld

Step 5: Install Project Dependencies

Once inside the project directory, install the necessary dependencies:

bash
npm install

Step 6: Configure the Project for Airbase

You need to configure the project for Airbase using the airbase configure command:

bash
airbase configure

Follow the prompts to set up your project. For example:

  • Project Name: hello
  • Framework: nextjs-standalone
  • Build command: npm run build
  • Start command: node server.js

Step 7: Build the Project

Once configured, build your project to create a deployment package:

bash
airbase build

If the build is successful, you’ll see output indicating the build status.

Step 8: Link the Project to Airbase

Before you can deploy, you must link the project to Airbase. Use the following command:

bash
airbase link

If prompted, select the appropriate project or create a new one via the Airbase Console.

Step 9: Deploy the Project

Finally, deploy your project using:

bash
airbase deploy

Follow the prompts to confirm the deployment. Once deployed, you'll receive a URL to access your project.

Additional Tips

  • Use dir instead of ls on Windows when viewing directories.
  • If you need to remove or update the Airbase CLI, use:
    bash
    npm remove --global @airbase/airbase-cli npm install --global @airbase/airbase-cli

By following these steps, you can efficiently manage and deploy projects using Airbase on a Windows computer. For further configuration details and advanced setup, consult the Airbase documentation.


Reference:

https://console.airbase.sg/docs/get-started/installation

https://console.airbase.sg/settings/credentials

 insights:

  1. remove sudo from the command line when running in windows.


Microsoft Windows [Version 10.0.22631.4317]

(c) Microsoft Corporation. All rights reserved.


C:\Users\weelo>sudo npm install --global @airbase/airbase-cli

'sudo' is not recognized as an internal or external command,

operable program or batch file.


C:\Users\weelo>npm install --global @airbase/airbase-cli

npm warn deprecated inflight@1.0.6: This module is not supported, and leaks memory. Do not use it. Check out lru-cache if you want a good and tested way to coalesce async requests by a key value, which is much more comprehensive and powerful.

npm warn deprecated rimraf@3.0.2: Rimraf versions prior to v4 are no longer supported

npm warn deprecated glob@7.2.3: Glob versions prior to v9 are no longer supported

npm warn deprecated glob@7.2.3: Glob versions prior to v9 are no longer supported

npm warn deprecated npmlog@5.0.1: This package is no longer supported.

npm warn deprecated are-we-there-yet@2.0.0: This package is no longer supported.

npm warn deprecated gauge@3.0.2: This package is no longer supported.


added 263 packages in 16s


52 packages are looking for funding

  run `npm fund` for details


C:\Users\weelo>airbase --version

2.18.3


C:\Users\weelo>npm remove --global @airbase/airbase-cli && sudo npm install --global @airbase/airbase-cli


removed 263 packages in 781ms

'sudo' is not recognized as an internal or external command,

operable program or batch file.


C:\Users\weelo>npm install --global @airbase/airbase-cli

npm warn deprecated inflight@1.0.6: This module is not supported, and leaks memory. Do not use it. Check out lru-cache if you want a good and tested way to coalesce async requests by a key value, which is much more comprehensive and powerful.

npm warn deprecated npmlog@5.0.1: This package is no longer supported.

npm warn deprecated rimraf@3.0.2: Rimraf versions prior to v4 are no longer supported

npm warn deprecated glob@7.2.3: Glob versions prior to v9 are no longer supported

npm warn deprecated glob@7.2.3: Glob versions prior to v9 are no longer supported

npm warn deprecated are-we-there-yet@2.0.0: This package is no longer supported.

npm warn deprecated gauge@3.0.2: This package is no longer supported.


added 263 packages in 3s


52 packages are looking for funding

  run `npm fund` for details


C:\Users\weelo>airbase login

馃洬 Log in to Airbase in your browser

  Visit: https://console.airbase.sg/settings/credentials/cli?challenge=508b51496f6d34c19f00aa692273ce5c22b8c73e4610e5dd09b6137eea5c8fe4


Press Ctrl + C to cancel

Creating a new configuration file at C:\Users\weelo\.airbaserc

✅  Successfully logged in


Go to https://console.airbase.sg/docs/get-started/project-setup to set up your first project.


C:\Users\weelo>git clone https://github.com/GovTechSG/template-nextjs-helloworld.git

Cloning into 'template-nextjs-helloworld'...

remote: Enumerating objects: 69, done.

remote: Counting objects: 100% (69/69), done.

remote: Compressing objects: 100% (50/50), done.

remote: Total 69 (delta 31), reused 46 (delta 12), pack-reused 0 (from 0)

Receiving objects: 100% (69/69), 72.79 KiB | 8.09 MiB/s, done.

Resolving deltas: 100% (31/31), done.


C:\Users\weelo>cd template-nextjs-helloworld


C:\Users\weelo\template-nextjs-helloworld>npm install


added 298 packages, and audited 299 packages in 25s


108 packages are looking for funding

  run `npm fund` for details


3 vulnerabilities (1 moderate, 2 high)


To address issues that do not require attention, run:

  npm audit fix


To address all issues, run:

  npm audit fix --force


Run `npm audit` for details.


C:\Users\weelo\template-nextjs-helloworld>airbase configure


Configuring project for Airbase

? Project Name: hello

? Framework: nextjs-standalone

? Build command: npm run build

? Command to start production server: node server.js


 {

-  name: "template-nextjs-helloworld"

+  name: "hello"

   framework: "nextjs-standalone"

   scripts: {

     build: "npm run build"

     start: "node server.js"

   }

 }


? Save configuration? Yes


Configuration saved in ./airbase.json

Run airbase build to create a deployment package.


C:\Users\weelo\template-nextjs-helloworld>airbase link

{

  compatibleVersions: [ '^2.18.3' ],

  version: '2.18.3',

  compatible: true,

  message: undefined

}

No existing projects. Create a new project in https://console.airbase.sg/


C:\Users\weelo\template-nextjs-helloworld> airbase build

Building hello with framework nextjs-standalone


  > npm run build



> template-nextjs-helloworld@0.1.0 build

> next build


Attention: Next.js now collects completely anonymous telemetry regarding usage.

This information is used to shape Next.js' roadmap and prioritize features.

You can learn more, including how to opt-out if you'd not like to participate in this anonymous program, by visiting the following URL:

https://nextjs.org/telemetry


 ✓ Linting and checking validity of types

   ▲ Next.js 14.0.3


Browserslist: caniuse-lite is outdated. Please run:

  npx browserslist@latest --update-db

  Why you should do it regularly: https://github.com/browserslist/browserslist#browsers-data-updating

 ✓ Creating an optimized production build

 ✓ Compiled successfully

 ✓ Collecting page data

 ✓ Generating static pages (3/3)

 ✓ Collecting build traces

 ✓ Finalizing page optimization


Route (pages)                              Size     First Load JS

┌ ○ /                                      9.38 kB        87.4 kB

├   /_app                                  0 B              78 kB

├ ○ /404                                   180 B          78.2 kB

└ 位 /api/hello                             0 B              78 kB

+ First Load JS shared by all              108 kB

  ├ chunks/framework-66d32731bdd20e83.js   45.2 kB

  ├ chunks/main-bac2f07e2c919777.js        31.8 kB

  ├ chunks/pages/_app-8eefc1d56f1fe6ce.js  296 B

  ├ chunks/webpack-8fa1640cc84ba8fe.js     753 B

  └ css/455380e8d74e6160.css               30.4 kB


○  (Static)   prerendered as static content

位  (Dynamic)  server-rendered on demand using Node.js



Successfully built hello!

Run airbase deploy to launch your application! 馃洬


C:\Users\weelo\template-nextjs-helloworld> airbase deploy

{

  compatibleVersions: [ '^2.18.3' ],

  version: '2.18.3',

  compatible: true,

  message: undefined

}

Project not found


C:\Users\weelo\template-nextjs-helloworld>airbase link

{

  compatibleVersions: [ '^2.18.3' ],

  version: '2.18.3',

  compatible: true,

  message: undefined

}

No existing projects. Create a new project in https://console.airbase.sg/


C:\Users\weelo\template-nextjs-helloworld>airbase link

{

  compatibleVersions: [ '^2.18.3' ],

  version: '2.18.3',

  compatible: true,

  message: undefined

}

? Overwrite existing link? undefined Yes

? Select project hello

Link saved


C:\Users\weelo\template-nextjs-helloworld>airbase build

Building hello with framework nextjs-standalone


  > npm run build



> template-nextjs-helloworld@0.1.0 build

> next build


 ✓ Linting and checking validity of types

   ▲ Next.js 14.0.3


 ✓ Creating an optimized production build

 ✓ Compiled successfully

 ✓ Collecting page data

 ✓ Generating static pages (3/3)

 ✓ Collecting build traces

 ✓ Finalizing page optimization


Route (pages)                              Size     First Load JS

┌ ○ /                                      9.38 kB        87.4 kB

├   /_app                                  0 B              78 kB

├ ○ /404                                   180 B          78.2 kB

└ 位 /api/hello                             0 B              78 kB

+ First Load JS shared by all              108 kB

  ├ chunks/framework-66d32731bdd20e83.js   45.2 kB

  ├ chunks/main-bac2f07e2c919777.js        31.8 kB

  ├ chunks/pages/_app-8eefc1d56f1fe6ce.js  296 B

  ├ chunks/webpack-8fa1640cc84ba8fe.js     753 B

  └ css/455380e8d74e6160.css               30.4 kB


○  (Static)   prerendered as static content

位  (Dynamic)  server-rendered on demand using Node.js



Successfully built hello!

Run airbase deploy to launch your application! 馃洬


C:\Users\weelo\template-nextjs-helloworld>airbase.zip


C:\Users\weelo\template-nextjs-helloworld>airbase deploy

{

  compatibleVersions: [ '^2.18.3' ],

  version: '2.18.3',

  compatible: true,

  message: undefined

}

? Deploy hello: hello - default (production) Yes

Deployed hello: hello - default

Visit https://hello.app.airbase.sg


C:\Users\weelo\template-nextjs-helloworld>ls

'ls' is not recognized as an internal or external command,

operable program or batch file.


C:\Users\weelo\template-nextjs-helloworld>dir

 Volume in drive C is Windows

 Volume Serial Number is E8AB-455B


 Directory of C:\Users\weelo\template-nextjs-helloworld


10/28/2024  09:09 AM    <DIR>          .

10/28/2024  09:07 AM    <DIR>          ..

10/28/2024  09:07 AM    <DIR>          .airbase

10/28/2024  09:07 AM                43 .eslintrc.json

10/28/2024  09:07 AM               456 .gitignore

10/28/2024  09:13 AM    <DIR>          .next

10/28/2024  09:08 AM               137 airbase.json

10/28/2024  09:13 AM         5,911,310 airbase.zip

10/28/2024  09:09 AM               206 next-env.d.ts

10/28/2024  09:07 AM               149 next.config.js

10/28/2024  09:07 AM    <DIR>          node_modules

10/28/2024  09:07 AM           139,756 package-lock.json

10/28/2024  09:07 AM               679 package.json

10/28/2024  09:07 AM    <DIR>          public

10/28/2024  09:07 AM             1,789 README.md

10/28/2024  09:07 AM    <DIR>          src

10/28/2024  09:07 AM               655 tsconfig.json

              10 File(s)      6,055,180 bytes

               7 Dir(s)  1,439,764,860,928 bytes free


C:\Users\weelo\template-nextjs-helloworld>airbase deploy

{

  compatibleVersions: [ '^2.18.3' ],

  version: '2.18.3',

  compatible: true,

  message: undefined

}

? Deploy hello: hello - default (production) Yes

Deployed hello: hello - default

Visit https://hello.app.airbase.sg


C:\Users\weelo\template-nextjs-helloworld>airbase deploy

{

  compatibleVersions: [ '^2.18.3' ],

  version: '2.18.3',

  compatible: true,

  message: undefined

}

? Deploy hello: hello - default (production) Yes

Deployed hello: hello - default

Visit https://hello.app.airbase.sg


C:\Users\weelo\template-nextjs-helloworld>airbase build

Building hello with framework nextjs-standalone


  > npm run build



> template-nextjs-helloworld@0.1.0 build

> next build


 ✓ Linting and checking validity of types

   ▲ Next.js 14.0.3


 ✓ Creating an optimized production build

 ✓ Compiled successfully

 ✓ Collecting page data

 ✓ Generating static pages (3/3)

 ✓ Collecting build traces

 ✓ Finalizing page optimization


Route (pages)                              Size     First Load JS

┌ ○ /                                      9.4 kB         87.4 kB

├   /_app                                  0 B              78 kB

├ ○ /404                                   180 B          78.2 kB

└ 位 /api/hello                             0 B              78 kB

+ First Load JS shared by all              108 kB

  ├ chunks/framework-66d32731bdd20e83.js   45.2 kB

  ├ chunks/main-bac2f07e2c919777.js        31.8 kB

  ├ chunks/pages/_app-8eefc1d56f1fe6ce.js  296 B

  ├ chunks/webpack-8fa1640cc84ba8fe.js     753 B

  └ css/455380e8d74e6160.css               30.4 kB


○  (Static)   prerendered as static content

位  (Dynamic)  server-rendered on demand using Node.js



Successfully built hello!

Run airbase deploy to launch your application! 馃洬


C:\Users\weelo\template-nextjs-helloworld>airbase deploy

{

  compatibleVersions: [ '^2.18.3' ],

  version: '2.18.3',

  compatible: true,

  message: undefined

}

? Deploy hello: hello - default (production) Yes

Deployed hello: hello - default

Visit https://hello.app.airbase.sg


C:\Users\weelo\template-nextjs-helloworld>airbase build

Building hello with framework nextjs-standalone


  > npm run build



> template-nextjs-helloworld@0.1.0 build

> next build


 ✓ Linting and checking validity of types

   ▲ Next.js 14.0.3


 ✓ Creating an optimized production build

 ✓ Compiled successfully

 ✓ Collecting page data

 ✓ Generating static pages (3/3)

 ✓ Collecting build traces

 ✓ Finalizing page optimization


Route (pages)                              Size     First Load JS

┌ ○ /                                      9.4 kB         87.4 kB

├   /_app                                  0 B              78 kB

├ ○ /404                                   180 B          78.2 kB

└ 位 /api/hello                             0 B              78 kB

+ First Load JS shared by all              108 kB

  ├ chunks/framework-66d32731bdd20e83.js   45.2 kB

  ├ chunks/main-bac2f07e2c919777.js        31.8 kB

  ├ chunks/pages/_app-8eefc1d56f1fe6ce.js  296 B

  ├ chunks/webpack-8fa1640cc84ba8fe.js     753 B

  └ css/455380e8d74e6160.css               30.4 kB


○  (Static)   prerendered as static content

位  (Dynamic)  server-rendered on demand using Node.js



Successfully built hello!

Run airbase deploy to launch your application! 馃洬


C:\Users\weelo\template-nextjs-helloworld>airbase deploy

{

  compatibleVersions: [ '^2.18.3' ],

  version: '2.18.3',

  compatible: true,

  message: undefined

}

? Deploy hello: hello - default (production) Yes

Deployed hello: hello - default

Visit https://hello.app.airbase.sg


C:\Users\weelo\template-nextjs-helloworld>airbase build

Building hello with framework nextjs-standalone


  > npm run build



> template-nextjs-helloworld@0.1.0 build

> next build


 ✓ Linting and checking validity of types

   ▲ Next.js 14.0.3


 ✓ Creating an optimized production build

 ✓ Compiled successfully

 ✓ Collecting page data

 ✓ Generating static pages (3/3)

 ✓ Collecting build traces

 ✓ Finalizing page optimization


Route (pages)                              Size     First Load JS

┌ ○ /                                      9.4 kB         87.4 kB

├   /_app                                  0 B              78 kB

├ ○ /404                                   180 B          78.2 kB

└ 位 /api/hello                             0 B              78 kB

+ First Load JS shared by all              108 kB

  ├ chunks/framework-66d32731bdd20e83.js   45.2 kB

  ├ chunks/main-bac2f07e2c919777.js        31.8 kB

  ├ chunks/pages/_app-8eefc1d56f1fe6ce.js  296 B

  ├ chunks/webpack-8fa1640cc84ba8fe.js     753 B

  └ css/455380e8d74e6160.css               30.4 kB


○  (Static)   prerendered as static content

位  (Dynamic)  server-rendered on demand using Node.js



Successfully built hello!

Run airbase deploy to launch your application! 馃洬


C:\Users\weelo\template-nextjs-helloworld>airbase deploy

{

  compatibleVersions: [ '^2.18.3' ],

  version: '2.18.3',

  compatible: true,

  message: undefined

}

? Deploy hello: hello - default (production) Yes

Deployed hello: hello - default

Visit https://hello.app.airbase.sg

https://hello.app.airbase.sg
https://hello.app.airbase.sg



No comments:

Post a Comment