---

Overview

This repository contains the sources of AsyncAPI website:

• It's powered by Next.js,
• It uses Tailwind CSS framework,
• It's build and deployed with Netlify.

Requirements

Use the following tools to set up the project:

• Node.js v12.16+
• npm v6.13.7+

Usage

Install dependencies

To install all dependencies, run this command:

npm install

Develop

Launch the development server with the hot reloading functionality that allows any change in files to be immediately visible in the browser. Use this command:

npm run dev

You can access the live development server at localhost:3000.

Compose a new blog post

To bootstrap a new post, run this command:

npm run write:blog

Follow the interactive prompt to generate a post with pre-filled front matter.

Spin up Gitpod codespace

In order to prepare and spin up a Gitpod dev environment for our project, we configured our workspace through a .gitpod.yml file.

To spin up a Gitpod codespace, go to http://gitpod.io/#https://github.com/asyncapi/website.

Build

To build a production-ready website, run the following command:

npm run build

Generated files of the website go to the .next folder.

JSON Schema definitions

All AsyncAPI JSON Schema definition files are being served within the /definitions/<file> path. The content is being served from GH, in particular from https://github.com/asyncapi/spec-json-schemas/tree/master/schemas. This is possible thanks to the following:

1. A Netlify Rewrite rule located in the netlify.toml file, which acts as proxy for all requests to the /definitions/<file> path, serving the content from GH without having an HTTP redirect.
2. A Netlify Edge Function that modifies the Content-Type header of the rewrite response to become application/schema+json. This lets tooling, such as Hyperjump, to fetch the schemas directly from their URL.

Project structure

This repository has the following structure:

 ├── .github # Definitions of Github workflows, pull request and issue templates
├── components # Various generic components such as "Button", "Figure", etc.
├── config # Transformed static data to display on the pages such as blog posts etc.
├── context # Various React's contexts used in website
├── css # Various CSS files
├── lib # Various JS code for preparing static data to render in pages
├── pages # Website's pages source. It includes raw markdown files and React page templates.
│ ├── about # Raw blog for /about page
│ ├── blog # Blog posts
│ └── docs # Blog for /docs/* pages
├── public # Data for site metadata and static blog such as images
├── scripts # Scripts used in the build and dev processes
├── next.config.js # Next.js configuration file
├── netlify # Code that runs on Netlify
│ ├── edge-functions # Netlify Edge-Functions code
├── postcss.config.js # PostCSS configuration file
└── tailwind.config.js # TailwindCSS configuration file

Contributors ✨

Thanks goes to these wonderful people (emoji key):

Fran Méndez 💻📖🐛🎨🚧🚇🤔👀📝	Lukasz Gornicki 💻📖🐛🎨🚧🚇🤔👀📝	Maciej Urbańczyk 💻📖🐛🎨🚧🚇🤔👀📝	Alejandra Quetzalli 📖👀📢	Aayush Kumar Sahu 💻🐛🎨	David Boyne 💻🎨	Jesse Menning 📝
Dimitrios Dedoussis 📝	Jonas Lagoni 📝💻👀	Sergio Moya 💻📝👀	Bodo Graumann 📖	Damilola Randolph 💻	Barbanio González 📝🤔	Hargun Kaur 💻
Chris Eich 👀	Simone Fumagalli 📖	Missy Turco 💻🎨🤔👀	Ritik Rawal 💻	Akshat Nema 💻	David Pereira 💻📖	Debajyoti Halder 💻
Juan A. 💻	Muhammad Rafly Andrianza 📖	Harish 💻	Paul Goldsmith 💻🐛	Tabah Baridule 📖	Karuna Tata ️️️️♿️	Joseph Mawa 👀

This project follows the all-contributors specification. Contributions of any kind welcome!