9e033333f8
|
||
|---|---|---|
| .github/PULL_REQUEST_TEMPLATE | ||
| media | ||
| .gitignore | ||
| CODE_OF_CONDUCT.md | ||
| CONTRIBUTING.md | ||
| LICENSE | ||
| README.md | ||
| SECURITY.md | ||
README.md
Azure Static Web Apps Gallery Community Projects
A gallery of awesome projects built and deployed in Azure Static Web Apps.
🔥 Submit your Projects
Would you like to include your projects to this gallery? Follow the Checklist for Pull Request.
💻 Projects (by technology)
- Angular
- Eleventy
- Gatsby.js
- Hugo
- React.js
- Stencil
- Scully
- Svelte
- Vanilla HTML JavaScript CSS
- Vue.js
- VuePress
Angular
Catsify: A cat names generator
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: Generate Code from SketchApp
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
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: Angular Package Registry
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
Meme4Fun
Meme4Fun is an app to create custom programming memes from a picture and it also identifies features of people in the image.
Stacks Used:
angular, typescript, azure static web apps, material design, Azure Cognitive services
Angular Server Side Rendering
A prerendred Angular application built with Angular universal (aka. @angular/platform-server).
Stacks Used:
angular, typescript, azure static web apps, server-side rendering
Eleventy
Eleventy Blog Starter
A base blog scaffolded using the Eleventy base blog starter.
Stacks Used:
eleventy, html, css, javascript, azure static web apps
- Link to the project: HERE
- GitHub repo: HERE
- Author: @manekinekko
Gatsby.js
Gatsbyjs Starter
A very simple starter scaffolded using the gatsby.js framework.
Stacks Used:
reactjs, azure static web apps, gatsbyjs
Hugo
ngVikings 2020: A free online conference for Angular developers
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
React.js
Sunrise Standup
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
Stencil
Stencil Starter App
Stencil is a toolchain for building reusable, scalable Design Systems. Generate small, blazing fast, and 100% standards based Web Components that run in every browser.
Stacks Used:
stencil.js, azure static web apps
Scully
PWA Blog
News and articles about Progressive Web Apps.
Stacks Used:
angular, scully, azure static web apps, workbox, pwa
Svelte
Svelte Todo App
a little descriptions about the project.
Link to the project: HERE
Stacks Used:
svelte, azure static web apps
Vanilla HTML JavaScript CSS
Azure SWAG Demo: A Positive Thought For Your Day
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
Nitrooo landing page
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 CLI Landing Page
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, css, javascript
Vue.js
PoseDance: A TikTok Trainer App
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
VS Code Can Do That
All the best things about VS Code that nobody ever bothered to show you.
Stacks Used:
vuejs, azure static web apps
VuePress
Nitro Workshop
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 for Visual Studio Code Documentation
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