Website with intuitive UI designs
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. You can also check out website to view a live example of this repository.
Services
portfolio
Table of contents
- Key features
- Canopas website -- Backend
- Canopas website -- Frontend
- Formatting and Linting
- Dependencies
- Licence
Key Features
-
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.
-
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.
-
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.
-
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.
-
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.
-
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.
-
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.
-
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.21
Setup
-
Start Go Server
go run main.go
If any dependency error is there, run
go mod tidy
You can access the APIs at
http://localhost:8080
.
We are using go modules for go package dependency.
-
Initialize go modules
go mod init
-
By running above command go.mod file created in project directory. It includes all packages required in project.
-
Add package in project
go get package_name
-
Update package
go get -u package_name
-
sync dependency with go.mod
go mod tidy
For writing unit tests in golang :
-
cd to package for which, you want to write test.
cd package_name
-
Create file with suffix test like packageName_test.go.
-
Create function with prefix Test like TestFunctionName.
-
Run test using
go test .
For cleaning test cache
go clean -testcache
Here is APIs reference used in the website.
For generating sitemap :
- Add your pages to templates/path.txt
Canopas website -- Frontend
Requirements
- Node20
Setup
Install dependencies
cd nuxt-frontend && yarn install
Start website in dev mode using,
yarn dev
Compiles and minifies for production
yarn build
You can access the page by pointing a web browser at http://localhost:8080.
Formatting and Linting
The pre-commit hook will automatically lint and format your code before committing.
To enable pre-commit hook
git config core.hooksPath .githooks
Dependencies
Backend
gin
- The core package of the Gin web framework, providing routing, middleware, and other essential features for building web applications.
sqlx
- A library that provides a set of extensions on top of the standard Go database/sql package. It enhances database access with features like named parameters and better scanning into structs.
logrus
- A structured logger for Go. It provides a flexible way to log messages with different severity levels and customizable output formats.
testify
- A popular testing toolkit for Go. It provides various assertion functions and testing utilities to enhance the readability and maintainability of your test code.
cors
- A middleware for Gin that provides Cross-Origin Resource Sharing (CORS) support, allowing controlled access to resources hosted on different domains.
gzip
- A middleware for Gin that enables Gzip compression of HTTP responses, reducing data transfer size and improving performance.
Frontend
VueJs
- It is used to build web interfaces and one-page applications.
Vite
- It is frontend build tool that significantly improves the frontend development experience. We have used it for server side rendering.
Tailwind CSS
- A utility-first CSS framework packed with classes like flex, pt-4, my-4 and text-center that can be composed to build any design, directly in your markup.
Vue collapse transition
- It is used for collapses elements horizontally or vertically.
FontAwesome
- Used for icons.
Swiper
- Used for Animation.
Credits
This repository is owned and maintained by the Canopas team. If you are interested in building web apps or designing products, please let us know. We'd love to hear from you!
LICENSE
Canopas website is released under the GNU V3.