- Notifications
You must be signed in to change notification settings - Fork0
This project is a small but feature complete application build with Fastify and Svelte, and it aims to show all the core concepts of Fastify, best practices, and recommendations.
License
pawel-id/fastify-example
Folders and files
Name | Name | Last commit message | Last commit date | |
---|---|---|---|---|
Repository files navigation
This project is a small but feature complete application build with Fastify and Svelte,and it aims to show all the core concepts of Fastify, best practices, and recommendations.
There is no attached blog post or tutorial, you should go through the application codeand read the code comments, which will explain you best practices, protips, suggestionsand so forth, I hope you will like it!
This application is an URL shortener, it exposes an admin UI and a series of routesunder the/_app
prefix.Any other request will be interpreted as redirect. If a redirect does not exists,the user will either see a standard 404 page, or a page with a series of suggestionsgenerated by Elasticsearch(both this pages are server side rendered!).
The admin logins via GitHub OAuth, the application is also protected by a rate limiterand during development it exposes a Swagger UI with every endpoint.Read the next section to understand how the project works and how it is recommendedto explore it.
The project follows a well established pattern within the Fastify community,it has two top level folders,plugins
androutes
.
The first one contains all the code that should be shared across your entireaplication, such as authentication and rate limiting, while the second onecontains all the business logic, such as the redirect code and the admin APIs.
We recommend to follow this pattern, you can generate a project with the samestructure by usingfastify-cli.
You can read the project in any order, but I would recommend the following:
app.js
plugins/authorization.js
plugins/elasticsearch.js
plugins/rate-limit.js
plugins/validUrl.js
plugins/swagger.js
routes/status.js
routes/frontend.js
routes/admin.js
routes/redirect/index.js
routes/redirect/update-count.js
routes/redirect/worker.cjs
routes/redirect/App.svelte
ui/*
test/helper.js
test/plugins/validUrl.test.js
test/routes/status.test.js
test/routes/admin.test.js.test.js
test/routes/redirect.test.js.test.js
I'm not. From Node.js v12.20 and Node.js v14 ES Modules are supportedout of the box.As you can see in thepackage.json
, there is a new field:{ "type": "module" }
.That field will instruct Node.js that the project is using ESM instead of CJS (common js, which isrequire
/module.exports
), and every.js
file will be a ESM module, while every.cjs
file will be a CJS module.
A follow up question you can ask now is: "why is there arollup.config.js
?Great question! That is used for compiling the Svelte frontend locatated inui/
.
Yes! Fastify supports TypeScriptout of the box!The project is written in plain JavaScript because I didn't want to add too many thingsto the project, but probably in the future there will be a branch with a TypeScript implementation.
Fastify supports promises/async-awaitout of the box.Everything is handled for you, if you throw an error inside a route handler (same goesfor hooks or plugins) the error will be caught automatically by Fastify and returnthe most approriate error.
No specific reason, any frontend framework will do the job well. I used Svelte because I likeit and because it makes it very easy to think about the frontend, without making me thinktoo much about how something should be written or weird APIs, but directly focusingon the business logic while writing almost plain html/css/js.
Create an
.env
file from the template:cp .env.template .env
Create a new GitHub OAuth applicationhere, then copy the app id and secret and add them to the env file:
GITHUB_APP_ID=<app-id>GITHUB_APP_SECRET=<app-secret>
Add your primary GitHub email to the
ALLOWED_USERS
variable:ALLOWED_USERS=<your-primary-github-mail>
Run the
keys-generator
script and store the result in theCOOKIE_SECRET
env variable:node scripts/keys-generator.js
COOKIE_SECRET=<generated-key>
Now you can either run the project locally or deploy it.
Use Node.js v18.
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.37.2/install.sh| bashnvm install 18node -v# should be v18.minor.patch
Install the project dependencies:
npm install
In a separate terminal window, run Elasticsearch:
npm run elasticsearch
Once Elasticsearch is up and running, run the
prepare-elasticsearch
script and copy the result in theELASTIC_URL
andELASTIC_API_KEY
env variables:nodescripts/prepare-elasticsearch.js
ELASTIC_ADDRESS=<result.address>ELASTIC_API_KEY=<result.apiKey>
You are all set! Run the project with thw following command:
npm run dev
This section contains instructions for deploying this application.
Would you like to see more recipes? Open anissue.Do you already have a deploy recipe and want to share it? That's awesome, send apull request!
Opendeploy-recipes/cloud-run
, you will find everything you need there.
You can create an Elasticsearch cluster with Elastic Cloud, with a free 14-day trial of theElasticsearch Service.
Feel free to send pull request with new features, bugfix or documentation improvements!
Open anissue or take a look at ourfastify/help
repository.We also have aDiscord community you can join.
If you have any question related to Elasticsearch or the Elasticsearch client,you can open a new discussion ondiscuss.elastic.coor in the clientissue tracker.
This software is licensed under theApache 2 license.
About
This project is a small but feature complete application build with Fastify and Svelte, and it aims to show all the core concepts of Fastify, best practices, and recommendations.
Resources
License
Stars
Watchers
Forks
Releases
Packages0
Languages
- JavaScript79.1%
- Svelte17.8%
- HTML1.9%
- Other1.2%