https://github.com/frankiefab100/netlify-serverless-functions-demo
👨💻 Learn how to use netlify serverless functions to hide secret/API keys in a frontend JavaScript web application.
https://github.com/frankiefab100/netlify-serverless-functions-demo
demo-app freecodecamp freecodecamp-javascript lambda lambda-functions netlify netlify-deployment netlify-functions netlify-lambda serverless serverless-functions tutorial tutorial-code
Last synced: 26 days ago
JSON representation
👨💻 Learn how to use netlify serverless functions to hide secret/API keys in a frontend JavaScript web application.
- Host: GitHub
- URL: https://github.com/frankiefab100/netlify-serverless-functions-demo
- Owner: frankiefab100
- License: mit
- Created: 2022-11-25T22:58:13.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2023-02-08T08:44:05.000Z (about 2 years ago)
- Last Synced: 2025-03-26T14:39:22.286Z (about 1 month ago)
- Topics: demo-app, freecodecamp, freecodecamp-javascript, lambda, lambda-functions, netlify, netlify-deployment, netlify-functions, netlify-lambda, serverless, serverless-functions, tutorial, tutorial-code
- Language: JavaScript
- Homepage: https://netlify-func-demo.netlify.app
- Size: 1.77 MB
- Stars: 7
- Watchers: 1
- Forks: 3
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
Netlify Serverless Functions Demo
Companion repository for the tutorial demostrating how to hide secret keys using netlify functions in a Frontend application
![]()
![]()
![]()
![]()
## What do you mean by "Netlify functions" ?
Netlify Functions are files used deploy server-side code as API endpoints without the need of backend.## Prerequisites
To follow along with this tutorial, basic understanding of RESTful APIs and `async/await` is required.
## Getting Started
It is recommended to start off from the [testing branch](https://github.com/frankiefab100/netlify-serverless-functions-demo/tree/testing).The final demo app lives in the `main` branch:
## How to run locally 🚀
1. Clone the repository
```BASH
git clone https://github.com/frankiefab100/netlify-serverless-functions-demo.git
```2. Change to netlify-serverless-functions-demo directory
```BASH
cd netlify-serverless-functions-demo
```3. Install dependencies
```BASH
npm install
```4. Run the app on the server
```BASH
netlify dev
```
The project will be ready on localhost:8888 via: `https://localhost:8888/.netlify/functions/getPhotos`Note: Add your API keys as Environment variable in `.env`: PIXABAY_API_KEY=your-api-key-here
## License 📜
This project is protected under the [MIT License](./License).## Deploy
[](https://app.netlify.com/start/deploy?repository=https://github.com/frankiefab100/netlify-serverless-functions-demo)## Resources
Check out the blog post: https://www.freecodecamp.org/news/hide-api-keys-in-frontend-apps-using-netlify-functions/## Relevant Links
- [Netlify Functions](https://docs.netlify.com/functions/overview/)
- [Netlify Lambda](https://github.com/netlify/netlify-lambda#usage)
- [Netlify Intro to Serverless Functions](https://www.netlify.com/blog/intro-to-serverless-functions/)
- [Netlify Edge Functions](https://docs.netlify.com/edge-functions/get-started/)
Built with ❤️