ACAP 1.0 Duplication Video Tutorials and References

Introduction

This wiki discusses the development and cloud deployment approaches and strategies used with ACAP 1.0 (ACAP-Bicol). This page aims to serve as a go-to reference for demonstrating technical methods in videos under the Playlist section and to provide general guidelines and recommended approaches to interact with the ACAP 1.0 source codes.

Tip

Updated development notes are available at
https://acaptutorials.github.io/

Tutorials

• ACAP 1.0 Duplication for New Regions Running on Localhost (Development)

Playlist

(Please turn on the CC captions/subtitles and set the playback speed to 2x when watching the videos.)

• https://youtube.com/playlist?list=PLk51OcRoDPHbXE_iVwmG_UwmsYwNOPoEP

Checklist

• Initial ACAP 1.0 Duplication Checklist

Requirements

• ACAP 1.0 Local Development Requirements

How to Proceed

1. Quickly view and skim thru the videos under the Playlist section to get a quick grasp and summary of how ACAP-Bicol is initialized for local development to online (live) deployment.

2. Initialize ACAP for your target region for localhost development by going thru the ACAP 1.0 Duplication for New Regions Running on Localhost (Development) Tutorial.

   • At this point, you may want to refer to the online video tutorials for more detailed demonstration on several topics related for ACAP's localhost development:
     • 06 Initialize the Source Code Repository - Part 1/2
     • 07 Initialize Firebase (Firestore, Storage, Authentication)
     • 08 Server setup for localhost development (Testing on Region 7)
     • 09 Client setup for localhost development (Testing on Region 7)
   • Run your client + server ACAP on localhost. Visit and check Initial ACAP 1.0 Duplication Checklist to see if your ACAP initialization fits with success several success metrics for localhost development

3. Online deployment is next after finishing and wrapping up running ACAP on localhost.

   • Online deployment is quite flexible and you may use new methods, techniques and services which you may be more familiar with.
   • You may also follow ACAP's methods for these areas, which are described and demonstrated in more detail in the tutorial videos:
     • 10 Deployment to Development Environment
       • Render Setup - Part 1 / 3 (development)
       • Initial Website Deployment to Firebase Hosting - Part 2 / 3
       • Using GitHub Actions - Part 3 / 3
     • 11 Deployment to Production Environment
       • Render Setup - Part 1 / 2 (production)
       • Website Deployment to GitHub Pages - Part 2 / 3
       • Post-Processing from GitHub Pages - Part 3 / 3

Video List

• 01 Create GitHub Account
• 02 Create GitHub Repositories
• 03 Create Firebase Projects
• 04 Create Render Accounts
• 05 Create a Semaphore Account
• 06 Initialize the Source Code Repository - Part 1/2
• 06 Initialize the Source Code Repository - Part 2/2
• 07 Initialize Firebase (Firestore, Storage, Authentication)
• 08 Server setup for localhost development (Testing on Region 7)
• 09 Client setup for localhost development (Testing on Region 7)
• 10 Deployment to Development Environment
  • Render Setup - Part 1 / 3 (development)
  • Initial Website Deployment to Firebase Hosting - Part 2 / 3
  • Using GitHub Actions - Part 3 / 3
• 11 Deployment to Production Environment
  • Render Setup - Part 1 / 2 (production)
  • Website Deployment to GitHub Pages - Part 2 / 3
  • Post-Processing from GitHub Pages - Part 3 / 3

Demo

These demos load the website front and backend (upon sign-in) with default Firestore data of the region we used throughout the tutorials (Region 7 provinces and municipalities). To follow updating full UI references of the "bicol" text in later updates.

Official Production Demo

https://region7-tutorial.github.io/

Development Version Demo

https://region7-tutorial-dev.web.app