Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/stelace/heroes-platform-demo
:sparkles: Open-source Web platform built on top of Stelace backend Search, Automation and Real-Time APIs. Empowering super heroes in NYC.
https://github.com/stelace/heroes-platform-demo
api automation jamstack marketplace platform quasar real-time search serverless stelace-api vue
Last synced: 8 days ago
JSON representation
:sparkles: Open-source Web platform built on top of Stelace backend Search, Automation and Real-Time APIs. Empowering super heroes in NYC.
- Host: GitHub
- URL: https://github.com/stelace/heroes-platform-demo
- Owner: stelace
- License: mit
- Archived: true
- Created: 2019-06-25T04:19:42.000Z (over 5 years ago)
- Default Branch: dev
- Last Pushed: 2024-01-23T08:27:18.000Z (10 months ago)
- Last Synced: 2024-08-02T00:25:41.750Z (3 months ago)
- Topics: api, automation, jamstack, marketplace, platform, quasar, real-time, search, serverless, stelace-api, vue
- Language: JavaScript
- Homepage:
- Size: 2.56 MB
- Stars: 18
- Watchers: 2
- Forks: 12
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
- quasar-awesome - github - source template featuring [Stelace platform runner](https://stelace.com) with Quasar UI and super heroes in NYC. | 1.0.0 | (Awesome Quasar [](https://github.com/sindresorhus/awesome) / Tutorials)
README
[](https://stelace.com)
# Stelace API Starter Kit
> This Stelace starter kit is free to use, under the terms of the [MIT license](./LICENSE).
Feel free to [fork](
https://app.netlify.com/start/deploy?repository=https://github.com/stelace/heroes-platform-demo
), contribute or just make it your own :heart:.
---
This __Web Platform starter kit with pre-configured serverless deployment__ leverages Stelace Search and Automation APIs to run a real-time platform full of super heroes operating in NYC.
- [Stelace docs quick start](https://stelace.com/docs/getting-started)
- [Blog post](https://stelace.com/blog/building-a-real-time-web-platform-from-scratch-in-one-week/)
- [More details](./HEROES.md) on how this works
[demo.webm](https://github.com/stelace/marketplace-demo/assets/25850444/00836041-1fd2-4175-8a11-708ea44424ce)
Free your mind and imagine how many cool things you could build on your own with Stelace API…
From online marketplaces to real-time platforms.
A more classical [marketplace starter kit](https://github.com/stelace/marketplace-demo) is also available with additional marketplace features such as Ratings, real-time Messaging, Asset pages and Transactions.
**What is Stelace?**
[Stelace](https://stelace.com/) provides search, inventory and user management infrastructure and APIs for Web platforms, ranging from search-intensive marketplaces to online community apps.
Stelace offers powerful backend and APIs including advanced search, automation, and content delivery, to let you focus on what makes your platform unique.
[API Docs](https://stelace.com/docs)
[](https://conventionalcommits.org) [](https://app.netlify.com/sites/stelace-heroes-platform-demo/deploys)
---
## Features
- Super Heroes as platform [Assets](https://stelace.com/docs/assets) that can be created by [Users](https://stelace.com/docs/users).
- Powerful and typo-tolerant [Search](https://stelace.com/docs/search) :mag:, and advanced filtering with [Custom Attributes](https://stelace.com/docs/assets/custom-attributes).
- Real-time [Events](https://stelace.com/docs/command/events) to automate the platform
- Automation with Stelace [Workflows](https://stelace.com/docs/command/workflows) and Tasks, making the Website demo aware of Heroes missions and locations in real-time, as you would for a ride-sharing platform (like Lyft) :traffic_light:
- Headless CMS :page_with_curl: with Stelace [Content API](https://stelace.com/docs/content)
- i18n :earth_africa: and full [translations](./docs/i18n.md)
- [Performance](./docs/performance.md) (90+ Lighthouse score) :checkered_flag:
- JSON [data import script](./docs/development-data.md), including Assets in CSV format.
- …
- and [much more](https://stelace.com) with Stelace API
## Integrations
Leverage these integrations to start running your platform even faster:
- Automated and continuous deployment with [Netlify](https://www.netlify.com/)
- Maps with [OpenStreetMap](https://www.openstreetmap.org/) provider
- [Sentry](https://sentry.io/) for logging in production environment
- Google Analytics
## Stack
Serverless [JAMStack architecture](https://jamstack.org/):
- [Vue.js](https://github.com/vuejs/vue)
- [Quasar](https://github.com/quasarframework/quasar) framework
- [Stelace API](https://stelace.com) as backend
- [Stelace headless CMS](https://stelace.com/docs/content)
- [Stelace.js](https://github.com/stelace/stelace.js) SDK
Node.js >= 10.18 is used for tooling.
## Make it your own
You first need to get your Stelace API keys. Good news: [it’s free](https://github.com/stelace/stelace).
1. Clone this repository
```sh
git clone https://github.com/stelace/heroes-platform-demo.git
cd heroes-platform-demo
```
2. Install node_modules
```sh
# using yarn instead of npm is recommended
yarn
```
> If you don’t have [yarn](https://yarnpkg.com/) installed, you can follow these [instructions](https://yarnpkg.com/docs/install).
3. Create environment files for development and production.
You can copy `.env.example` and fill it with Stelace API keys.
```sh
cp .env.example .env.development
# You may want to use live Stelace API keys in this file
cp .env.example .env.production
```
You need to fill the following environment variables:
- STELACE_*PUBLISHABLE_API_KEY (pubk_*...) used in Vue app
- STELACE_*SECRET_API_KEY (seck_*...) used in data seeding scripts
- VUE_APP_MAPBOX_STYLE to activate the map. You can upload live demo [dark map style](/map/darknyc.json) with [Maptiler](
https://www.maptiler.com/cloud/
) and get a [map style URL](
https://cloud.maptiler.com/maps/upload
): `https://api.maptiler.com/maps/YOUR_MAP_STYLE_ID/style.json?key=MAPTILER_KEY`.
You can get your API Keys in [Stelace Dashboard](https://stelace.com/dashboard).
4. Seed [data](./docs/development-data.md) and [workflows](https://stelace.com/docs/command/workflows).
```sh
yarn seed
```
5. Start front-end development server
```sh
yarn dev
# same as quasar dev
```
Please refer to [Quasar docs](https://v1.quasar-framework.org/) for more details about configuration and info on components.
Enjoy your platform :)
## Deployment
Please refer to [deployment docs section](./docs/deployment.md) for more details.
## Stelace Dashboard
Create you own account for free to build your own platform and use [official Stelace dashboard](
https://stelace.com
), enabling your team to access real-time stats, settings, live design and content editing with translation tools, asset and user management and much more.
[
](https://stelace.com)