A gallery of sample projects in JavaScript/Node.js and frameworks/Jamstack site generators deployed in Azure Static Web Apps.
Would you like to include your project hosted/deployed on Azure Static Web Apps on our gallery of samples? If so, just follow the Checklist for Pull Request, which as soon as possible we will include your deployed project in our repository!
- Angular Projects
- Scully Projects
- Hugo Projects
- React.js Projects
- Svelte Projects
- Vanilla HTML/JavaScript Projects
- Vue.js Projects
- VuePress Projects
Catsify is a simple and creative app that allows you to find a unique name for your lovely cat. What's interesting about this app is that the names generator is all written in Rust and compiled to WASM; and the API is exposed through a Node.js Azure Function.
Stacks Used:
angular, typescript, azure static web apps, rust, web assembly, nodejs, azure functions
xLayers is an online Web application which aims to bridge the gap between designers and developers. Its mission is to allow both the Design and Development worlds to collaborate and iterate fast. Simply upload your design to xLayers and instantly scaffolds code for many popular frameworks1 and libraries such as Angular, Vue, React, Stencil...etc.
Stacks Used:
angular, typescript, azure static web apps
Angular AppStore is a reference app featuring a full search user experience using Algolia. Users can enjoy the fast and smooth experience.
Stacks Used:
angular, typescript, azure static web apps, material design, algolia
NgxTools is an NPM registry clone made only for Angular packages. You can access hundred thousand of packages built specifically for Angular and available on NPM. You can access their metadata information, and even open them directly on StackBlitz.
Stacks Used:
angular, typescript, azure static web apps, pwa, algolia
News and articles about Progressive Web Apps.
Stacks Used:
angular, scully, azure static web apps, workbox, pwa
ngVikings is a non-profit, non-commercial, 100% community-driven event comprised of many Nordic Angular groups with more than 6500 active members in total.
Stacks Used:
hugo, azure static web apps, workbox
A social platform for teams to post 15 second status update videos. Videos are uploaded and streamed from Azure Storage, videos are transcribed using Cognitive Services and user locations are shown with Azure Maps.
Stacks Used:
reactjs, azure static web apps, azure storage, azure cognitive services, azure maps
a little descriptions about the project.
Link to the project: HERE
Stacks Used:
svelte, azure static web apps
This is a simple barebone demo for Azure SWAG (Static Web Apps on GitHub). You can use it as a template for your own apps.
Stacks Used:
html, javascript, nodejs, azure static web apps
Nitro is a heavily opinionated template for building Serverless applications with NestJS, the fastest-growing NodeJS framework in the world by github stars.
Stacks Used:
javascript, css, html
Hexa is the ultimate companion for the Azure CLI. It allows you to seamlessly configure, setup and deploy to different Azure services such as Resource Groups, Storage accounts, Hosting, Azure Functions and Databases (CosmosDB and Table Storage) and more.
Stacks Used:
html, javascript
Using PoseDance, a Machine-Learning library that can discern body positions, this app allows you to perfect your dance moves via your webcam. Match your dance, get a high score! Also features PlayFab and Azure Functions for the backend service.
Stacks Used:
vuejs, azure static web apps, machine learning, nodejs, javascript, azure functions
All the best things about VS Code that nobody ever bothered to show you.
Stacks Used:
vuejs, azure static web apps
Online workshop built with Vuepress to learn how to build a backend using NestJS. This is a practical workshop where you'll learn "hands-on" by iteratively building an application from scratch using NestJS and Azure.
Stacks Used:
vuepress, azure static web apps, nodejs, nestjs
Peacock is a Visual Studio Code extension with 700,000+ installations. It subtly changes the color of your Visual Studio Code workspace. This is ideal when you have multiple VS Code instances, use VS Live Share, or use VS Code's Remote features, and you want to quickly identify your editor.
Stacks Used:
vuepress, azure static web apps, nodejs