Merge branch 'master' into casestudy-section-frontend

canopas · Feb 27, 2024 · a5d7bd3 · a5d7bd3
2 parents 857feb5 + 52c696a
commit a5d7bd3
Show file tree

Hide file tree

Showing 224 changed files with 7,039 additions and 5,735 deletions.
diff --git a/.github/workflows/deploy-backend-dev.yml b/.github/workflows/deploy-backend-dev.yml
@@ -25,7 +25,7 @@ jobs:
           role-to-assume: arn:aws:iam::${{ secrets.AWS_ACCOUNT_ID }}:role/github-actions-backend-access
           aws-region: ap-south-1
 
-      - name: Build backend and deploy to S3
+      - name: Build backend and copy zip to S3
         run: |
           apt-get update && apt-get install -y zip
           GOOS=linux GOARCH=amd64 CGO_ENABLED=0 go build -o main main.go

diff --git a/.github/workflows/deploy-backend-prod.yml b/.github/workflows/deploy-backend-prod.yml
@@ -25,7 +25,7 @@ jobs:
           role-to-assume: arn:aws:iam::${{ secrets.AWS_ACCOUNT_ID }}:role/github-actions-backend-access
           aws-region: ap-south-1
 
-      - name: Build backend and deploy to S3
+      - name: Build backend and copy zip to S3
         run: |
           apt-get update && apt-get install -y zip
           GOOS=linux GOARCH=amd64 CGO_ENABLED=0 go build -o main main.go

diff --git a/.github/workflows/deploy-frontend-dev.yml b/.github/workflows/deploy-frontend-dev.yml
@@ -1,7 +1,10 @@
-name: DeployFrontendDev
+name: DeployFrontendServerlessDev
 
 on:
-  push:
+  workflow_run:
+    workflows: ["DeployBackendDev"]
+    types:
+      - completed
     branches:
       - "master"
 
@@ -25,13 +28,27 @@ jobs:
           role-to-assume: arn:aws:iam::${{ secrets.AWS_ACCOUNT_ID }}:role/github-actions-frontend-access
           aws-region: ap-south-1
 
-      - name: Build frontend and copy to S3
+      - name: Build frontend and copy zip to S3
         run: |
           cd nuxt-frontend
-          sed -i "s|VITE_IFRAMELY_KEY_VALUE|${{ secrets.IFRAMELY_KEY }}|g" config.js
           sed -i "s|VITE_RECAPTCHA_SITE_KEY_VALUE|${{ secrets.RECAPTCHA_SITE_KEY }}|g" config.js
-          sh ./../deploy/generate-sitemap.sh https://dev-stack.canopas.com https://dev-stack-api.canopas.com
-          yarn install --frozen-lockfile && yarn generate
-          aws s3 sync ./.output/public s3://dev-stack.canopas.com --exclude "*.js"
-          aws s3 sync ./.output/public s3://dev-stack.canopas.com --include "*.js" --content-type "application/javascript"
-          aws cloudfront create-invalidation --distribution-id ${{ secrets.DEV_CLOUDFRONT_DISTRIBUTION_ID }} --paths "/*"
+          sed -i "s|RESOURCES_URL|${{ secrets.RESOURCES_URL }}|g" config.js
+          sed -i "s|CLOUDFRONT_URL_VALUE|${{ secrets.CLOUDFRONT_URL_VALUE_DEV }}|g" config.js
+          yarn install --frozen-lockfile && yarn build
+          cd .output/server && zip canopas_website_SSR_dev_${{ github.sha }}-${{ github.run_attempt }}.zip -r . && aws s3 cp canopas_website_SSR_dev_${{ github.sha }}-${{ github.run_attempt }}.zip s3://canopas-lambda-handlers && cd ../..
+          aws s3 rm s3://canopas-website-ssr-dev --recursive
+          aws s3 sync --cache-control 'max-age=604800' --exclude *.html ./.output/public s3://canopas-website-ssr-dev
+          aws s3 sync ./.output/public s3://canopas-website-ssr-dev
+
+      - name: Deploy cloudformation stack
+        id: canopas-website-dev-lambda-stack-frontend
+        uses: aws-actions/aws-cloudformation-github-deploy@v1
+        with:
+          name: canopas-website-dev-lambda-stack-frontend
+          template: infrastructure/frontend.yml
+          capabilities: CAPABILITY_IAM,CAPABILITY_NAMED_IAM, CAPABILITY_AUTO_EXPAND
+          timeout-in-minutes: "10"
+          no-fail-on-empty-changeset: "1"
+          parameter-overrides: >-
+            EnvName=dev,
+            ZipFileName=canopas_website_SSR_dev_${{ github.sha }}-${{ github.run_attempt }}.zip
diff --git a/.github/workflows/deploy-frontend-prod.yml b/.github/workflows/deploy-frontend-prod.yml
@@ -1,7 +1,10 @@
-name: DeployFrontendProd
+name: DeployFrontendServerlessProd
 
 on:
-  push:
+  workflow_run:
+    workflows: ["DeployBackendProd"]
+    types:
+      - completed
     branches:
       - "master"
 
@@ -25,14 +28,28 @@ jobs:
           role-to-assume: arn:aws:iam::${{ secrets.AWS_ACCOUNT_ID }}:role/github-actions-frontend-access
           aws-region: ap-south-1
 
-      - name: Build frontend and copy to S3
+      - name: Build frontend and copy zip to S3
         run: |
           cd nuxt-frontend
-          sed -i "s|VITE_IFRAMELY_KEY_VALUE|${{ secrets.IFRAMELY_KEY }}|g" config.prod.js
           sed -i "s|VITE_RECAPTCHA_SITE_KEY_VALUE|${{ secrets.RECAPTCHA_SITE_KEY }}|g" config.prod.js
+          sed -i "s|RESOURCES_URL|${{ secrets.RESOURCES_URL }}|g" config.prod.js
+          sed -i "s|CLOUDFRONT_URL_VALUE|${{ secrets.CLOUDFRONT_URL_VALUE_PROD }}|g" config.prod.js
           mv config.prod.js config.js
-          sh ./../deploy/generate-sitemap.sh https://canopas.com https://prod-stack-api.canopas.com
-          yarn install --frozen-lockfile && yarn generate
-          aws s3 sync ./.output/public s3://canopas.com --exclude "*.js"
-          aws s3 sync ./.output/public s3://canopas.com --include "*.js" --content-type "application/javascript"
-          aws cloudfront create-invalidation --distribution-id ${{ secrets.PROD_CLOUDFRONT_DISTRIBUTION_ID }} --paths "/*"
+          yarn install --frozen-lockfile && yarn build
+          cd .output/server && zip canopas_website_SSR_prod_${{ github.sha }}-${{ github.run_attempt }}.zip -r . && aws s3 cp canopas_website_SSR_prod_${{ github.sha }}-${{ github.run_attempt }}.zip s3://canopas-lambda-handlers && cd ../..
+          aws s3 rm s3://canopas-website-ssr-dev --recursive
+          aws s3 sync --cache-control 'max-age=604800' --exclude *.html ./.output/public s3://canopas-website-ssr-prod
+          aws s3 sync ./.output/public s3://canopas-website-ssr-prod
+
+      - name: Deploy cloudformation stack
+        id: canopas-website-prod-lambda-stack-frontend
+        uses: aws-actions/aws-cloudformation-github-deploy@v1
+        with:
+          name: canopas-website-prod-lambda-stack-frontend
+          template: infrastructure/frontend.yml
+          capabilities: CAPABILITY_IAM,CAPABILITY_NAMED_IAM, CAPABILITY_AUTO_EXPAND
+          timeout-in-minutes: "10"
+          no-fail-on-empty-changeset: "1"
+          parameter-overrides: >-
+            EnvName=prod,
+            ZipFileName=canopas_website_SSR_prod_${{ github.sha }}-${{ github.run_attempt }}.zip
diff --git a/README.md b/README.md
@@ -1,16 +1,21 @@
+<p align="center"><a href="https://canopas.com/contact"><img src="./assets/banner.png"></a></p>
+
 <h1 align="left"><strong>Website with intuitive UI designs</strong></h1>
 
 We intend to keep this open source. Plan is to keep the repository up to date with latest technologies and best practices.
 
 ## Showcase
 
-This repository contains the working code of [Canopas website](https://canopas.com). You can check out the link to view a live example of this repository.
-
-### [Home Page](https://canopas.com/)
+This repository contains the working code of [Canopas website](https://canopas.com).
+You can also check out [website](https://canopas.com/) to view a live example of this repository.
 
 ### [Services](https://canopas.com/services)
 
-### [Contributions](https://canopas.com/contributions)
+<p align="center"><a href="https://canopas.com/services"><img src="./assets/services.gif" /></a></p>
+
+### [portfolio](https://canopas.com/portfolio)
+
+<p align="center"><a href="https://canopas.com/services"><img src="./assets/portfolio.gif" /></a></p>
 
 ---
 
@@ -32,29 +37,29 @@ This repository contains the working code of [Canopas website](https://canopas.c
 
 # Key Features
 
-1. **Vuejs as Frontend:** Canopas website is built using Vue.js, a progressive JavaScript framework that offers a flexible and efficient way to build user interfaces. Vue.js is renowned for its simplicity and ease of integration, making it an ideal choice for creating dynamic and interactive web applications.
+1. **Nuxt 3 as Frontend:** Canopas website is built using Nuxt 3, a progressive JavaScript framework that offers a flexible and efficient way to build user interfaces. Nuxt is renowned for its simplicity and ease of integration, making it an ideal choice for creating dynamic and interactive web applications.
 
-2. **Go as Backend:** canopas website backend is developed using the Go programming language, commonly referred to as Golang. Go is a statically typed, compiled language designed for simplicity, efficiency, and concurrency. With its focus on performance and readability, Go offers a robust foundation for building scalable applications.
+2. **Go as Backend:** Backend is developed using Golang. Go is a statically typed, compiled language designed for simplicity, efficiency, and concurrency. With its focus on performance and readability, Go offers a robust foundation for building scalable applications.
 
-3. **Server Side Rendering:** We have used SSR(Server Side Rendering) in website to improve performance. Server will render UI in `<!--app-html-->` part of `vue-frontend/index.html`. Due to this, reformating of `index.html` can cause UI breaking.
+3. **Server Side Rendering:** We have used Nuxt's different rendering modes for the website. For static pages, its SSG and for dynamic pages, we used SSR/ISR.
 
-4. **SEO-friendly URLs and Metadata:** We prioritize SEO best practices to ensure that canopas website receive the visibility they deserve in search engines. From meta tags to URL structure and sitemaps, canopas website is equipped with all the essential elements for optimal SEO.
+4. **SEO-friendly URLs and Metadata:** We prioritize SEO best practices to ensure that canopas website receive the visibility they deserve in search engines. From meta tags to URL structure and dynamic sitemaps, canopas website is equipped with all the essential elements for optimal SEO.
 
 5. **Responsive and Mobile-friendly Design:** We understand the importance of a mobile-friendly design in modern SEO. Canopas website is fully responsive and adapts seamlessly to various screen sizes, providing a positive user experience across devices.
 
-6. **CI/CD and Deployment:** With CI in place, every code change is automatically tested and integrated into the main codebase. This ensures that the main branch always remains stable, reducing the chances of bugs and allowing for rapid deployment. This repository contains AWS ECR/ECS and EC2 stack for frontend and backend deployment.
+6. **CI/CD and Deployment:** With CI in place, every code change is automatically tested and integrated into the main codebase. This ensures that the main branch always remains stable, reducing the chances of bugs and allowing for rapid deployment. This repository contains AWS Lambda, S3 and CloudFront stack for smooth deployment using cloudformation template.
 
 7. **Code formatting and linting:** Clean, readable, and consistent code is the foundation of any successful project. This website follows strict code formatting and linting rules, which are enforced through automated tools. This ensures that the codebase remains maintainable and adheres to industry best practices.
 
-8. **reCAPTCHA Integration:** Security is paramount, especially when it comes to user-generated content. Canopas website integrates reCAPTCHA, a widely trusted CAPTCHA service, to protect your site from spam and abuse while maintaining a user-friendly experience.
+8. **reCAPTCHA Integration:** Security is important aspect, especially when it comes to user-generated content. Canopas website integrates reCAPTCHA, a widely trusted CAPTCHA service, to protect your site from spam and abuse while maintaining a user-friendly experience.
 
 ---
 
 # Canopas website -- Backend
 
 ## Requirements
 
-- Go 1.20
+- Go 1.21
 
 ## Setup
 
@@ -126,11 +131,15 @@ This repository contains the working code of [Canopas website](https://canopas.c
 
   [Here](https://github.com/canopas/canopas-website/blob/master/api-doc.md) is APIs reference used in the website.
 
+### For generating sitemap :
+
+- Add your pages to templates/path.txt
+
 # Canopas website -- Frontend
 
 ## Requirements
 
-- Node18
+- Node20
 
 ## Setup
 
@@ -152,16 +161,6 @@ yarn dev
 yarn build
 ```
 
-### Server side rendering
-
-```
-yarn build
-```
-
-```
-yarn serve
-```
-
 You can access the page by pointing a web browser at http://localhost:8080.
 
 # Formatting and Linting
@@ -228,6 +227,12 @@ git config core.hooksPath .githooks
 
 - Used for Animation.
 
+## Credits
+
+This repository is owned and maintained by the [Canopas team](https://canopas.com/). If you are interested in building web apps or designing products, please let us know. We'd love to hear from you!
+
+<a href="https://canopas.com/contact"><img src="./assets/cta.png" width=300></a>
+
 ## LICENSE
 
-Canopas is released under the [GNU V3](https://github.com/canopas/canopas-website/blob/master/LICENSE.md).
+Canopas website is released under the [GNU V3](https://github.com/canopas/canopas-website/blob/master/LICENSE.md).
diff --git a/api-doc.md b/api-doc.md
@@ -259,44 +259,38 @@
     - Status Code: 200 Ok
     - Headers : none
     - Data :
-        <urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
-            <url>
-                <loc>http://canopas.com</loc>
-                <changefreq>monthly</changefreq>
-                <lastmod>2022-03-01T00:00:00.000Z</lastmod>
-                <priority>1</priority>
-            </url>
-            <url>
-                <loc>http://canopas.com/jobs</loc>
-                <changefreq>monthly</changefreq>
-                <lastmod>2022-03-01T00:00:00.000Z</lastmod>
-                <priority>1</priority>
-            </url>
-            <url>
-                <loc>http://canopas.com/contact</loc>
-                <changefreq>monthly</changefreq>
-                <lastmod>2022-03-01T00:00:00.000Z</lastmod>
-                <priority>0.9</priority>
-            </url>
-            <url>
-                <loc>https://blog.canopas.com</loc>
-                <changefreq>monthly</changefreq>
-                <lastmod>2022-03-01T00:00:00.000Z</lastmod>
-                <priority>0.8</priority>
-            </url>
-            <url>
-                <loc>http://canopas.com/jobs/ios-developers-a9b45f34-a1a5-419f-b536-b7c290925d6d</loc>
-                <changefreq>monthly</changefreq>
-                <lastmod>2022-03-01T00:00:00.000Z</lastmod>
-                <priority>0.9</priority>
-            </url>
-            <url>
-                <loc>http://canopas.com/jobs/apply/ios-developers-a9b45f34-a1a5-419f-b536-b7c290925d6d</loc>
-                <changefreq>monthly</changefreq>
-                <lastmod>2022-03-01T00:00:00.000Z</lastmod>
-                <priority>0.9</priority>
-            </url>
-        </urlset>
+        [
+            {
+                "loc": "/services",
+                "changefreq": "monthly",
+                "lastmod": "2024-02-01T00:00:00.000Z",
+                "priority": "0.9"
+            },
+            {
+                "loc": "/portfolio",
+                "changefreq": "monthly",
+                "lastmod": "2024-02-01T00:00:00.000Z",
+                "priority": "0.9"
+            },
+            {
+                "loc": "/contributions",
+                "changefreq": "monthly",
+                "lastmod": "2024-02-01T00:00:00.000Z",
+                "priority": "0.9"
+            },
+            {
+                "loc": "/resources",
+                "changefreq": "monthly",
+                "lastmod": "2024-02-01T00:00:00.000Z",
+                "priority": "0.9"
+            },
+            {
+                "loc": "/blog",
+                "changefreq": "monthly",
+                "lastmod": "2024-02-01T00:00:00.000Z",
+                "priority": "0.9"
+            },
+        ]
 ```
 
 ### 6. Send New Leave Request mail

diff --git a/assets/banner.png b/assets/banner.png
diff --git a/assets/cta.png b/assets/cta.png
diff --git a/assets/portfolio.gif b/assets/portfolio.gif
diff --git a/assets/services.gif b/assets/services.gif