{"id":16352647,"url":"https://github.com/frankiefab100/netlify-serverless-functions-demo","last_synced_at":"2025-07-08T05:10:50.784Z","repository":{"id":115067191,"uuid":"570716893","full_name":"frankiefab100/netlify-serverless-functions-demo","owner":"frankiefab100","description":"👨‍💻  Learn how to use netlify serverless functions to hide secret/API keys in a frontend JavaScript web application.","archived":false,"fork":false,"pushed_at":"2023-02-08T08:44:05.000Z","size":1853,"stargazers_count":7,"open_issues_count":0,"forks_count":3,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-03-26T14:39:22.286Z","etag":null,"topics":["demo-app","freecodecamp","freecodecamp-javascript","lambda","lambda-functions","netlify","netlify-deployment","netlify-functions","netlify-lambda","serverless","serverless-functions","tutorial","tutorial-code"],"latest_commit_sha":null,"homepage":"https://netlify-func-demo.netlify.app","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/frankiefab100.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2022-11-25T22:58:13.000Z","updated_at":"2025-02-17T22:53:29.000Z","dependencies_parsed_at":null,"dependency_job_id":"ae5bf1ab-d8b7-4312-87d0-3ce71fcda541","html_url":"https://github.com/frankiefab100/netlify-serverless-functions-demo","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/frankiefab100%2Fnetlify-serverless-functions-demo","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/frankiefab100%2Fnetlify-serverless-functions-demo/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/frankiefab100%2Fnetlify-serverless-functions-demo/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/frankiefab100%2Fnetlify-serverless-functions-demo/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/frankiefab100","download_url":"https://codeload.github.com/frankiefab100/netlify-serverless-functions-demo/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248626385,"owners_count":21135654,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["demo-app","freecodecamp","freecodecamp-javascript","lambda","lambda-functions","netlify","netlify-deployment","netlify-functions","netlify-lambda","serverless","serverless-functions","tutorial","tutorial-code"],"created_at":"2024-10-11T01:27:03.566Z","updated_at":"2025-04-12T20:22:13.288Z","avatar_url":"https://github.com/frankiefab100.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cdiv align=\"center\"\u003e\r\n \u003ch1\u003eNetlify Serverless Functions Demo\u003c/h1\u003e\r\n \u003cp\u003eCompanion repository for the tutorial demostrating how to hide secret keys using netlify functions in a Frontend application\u003c/p\u003e\r\n\r\n\u003cp align=\"center\"\u003e\r\n\u003ca href=\"https://github.com/frankiefab100/netlify-serverless-functions-demo/fork\" target=\"blank\"\u003e\r\n\u003cimg src=\"https://img.shields.io/github/forks/frankiefab100/netlify-serverless-functions-demo?style=flat-square\" alt=\"netlify-serverless-functions-demo forks\"/\u003e\r\n\u003c/a\u003e\r\n\u003ca href=\"https://github.com/frankiefab100/netlify-serverless-functions-demo/stargazers\" target=\"blank\"\u003e\r\n\u003cimg src=\"https://img.shields.io/github/stars/frankiefab100/netlify-serverless-functions-demo?style=flat-square\" alt=\"netlify-serverless-functions-demo stars\"/\u003e\r\n\u003c/a\u003e\r\n\u003ca href=\"https://github.com/frankiefab100/netlify-serverless-functions-demo/issues\" target=\"blank\"\u003e\r\n\u003cimg src=\"https://img.shields.io/github/issues/frankiefab100/netlify-serverless-functions-demo?style=flat-square\" alt=\"netlify-serverless-functions-demo issues\"/\u003e\r\n\u003c/a\u003e\r\n\u003ca href=\"https://github.com/frankiefab100/netlify-serverless-functions-demo/tree/main/LICENSE\" target=\"blank\"\u003e\r\n\u003cimg src=\"https://img.shields.io/github/license/frankiefab100/netlify-serverless-functions-demo?style=flat-square\" alt=\"netlify-serverless-functions-demo licence\" /\u003e\r\n\u003c/a\u003e\r\n\u003c/p\u003e\r\n\r\n\u003cp\u003e\r\n\u003cimg src=\"https://img.shields.io/badge/HTML5-E34F26?style=for-the-badge\u0026logo=html5\u0026logoColor=white\"\u003e\r\n\u003cimg src=\"https://img.shields.io/badge/CSS3-1572B6?style=for-the-badge\u0026logo=css3\u0026logoColor=white\"\u003e\r\n\u003cimg src=\"https://img.shields.io/badge/JavaScript-323330?style=for-the-badge\u0026logo=javascript\u0026logoColor=F7DF1E\"\u003e\r\n\u003cimg src=\"https://img.shields.io/badge/Netlify-00C7B7?style=for-the-badge\u0026logo=netlify\u0026logoColor=white\"\u003e\r\n\u003c/p\u003e\r\n\u003c/div\u003e\r\n\r\n## What do you mean by \"Netlify functions\" ?\r\nNetlify Functions are files used deploy server-side code as API endpoints without the need of backend.\r\n\r\n## Prerequisites\r\n\r\nTo follow along with this tutorial, basic understanding of RESTful APIs and  `async/await` is required.\r\n\r\n## Getting Started\r\nIt is recommended to start off from the [testing branch](https://github.com/frankiefab100/netlify-serverless-functions-demo/tree/testing).\r\n\r\nThe final demo app lives in the `main` branch: \u003chttps://netlify-func-demo.netlify.app/\u003e\r\n\r\n\r\n## How to run locally 🚀\r\n\r\n1. Clone the repository\r\n\r\n```BASH\r\ngit clone https://github.com/frankiefab100/netlify-serverless-functions-demo.git\r\n```\r\n\r\n2. Change to netlify-serverless-functions-demo directory\r\n\r\n```BASH\r\ncd netlify-serverless-functions-demo\r\n```\r\n\r\n3. Install dependencies\r\n\r\n```BASH\r\nnpm install\r\n```\r\n\r\n4. Run the app on the server\r\n```BASH\r\nnetlify dev\r\n```\r\nThe project will be ready on localhost:8888 via: `https://localhost:8888/.netlify/functions/getPhotos`\r\n\r\n\r\nNote: Add your API keys as Environment variable in `.env`: PIXABAY_API_KEY=your-api-key-here\r\n\r\n## License 📜\r\nThis project is protected under the [MIT License](./License).\r\n\r\n## Deploy\r\n[![netlify](https://www.netlify.com/img/deploy/button.svg)](https://app.netlify.com/start/deploy?repository=https://github.com/frankiefab100/netlify-serverless-functions-demo)\r\n\r\n## Resources\r\nCheck out the blog post: https://www.freecodecamp.org/news/hide-api-keys-in-frontend-apps-using-netlify-functions/\r\n\r\n\r\n## Relevant Links\r\n\r\n- [Netlify Functions](https://docs.netlify.com/functions/overview/)\r\n- [Netlify Lambda](https://github.com/netlify/netlify-lambda#usage)\r\n- [Netlify Intro to Serverless Functions](https://www.netlify.com/blog/intro-to-serverless-functions/)\r\n- [Netlify Edge Functions](https://docs.netlify.com/edge-functions/get-started/)\r\n\r\n\r\n\u003chr\u003e\r\n\u003cp align=\"center\"\u003e\r\nBuilt with ❤️\r\n\u003c/p\u003e\r\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffrankiefab100%2Fnetlify-serverless-functions-demo","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ffrankiefab100%2Fnetlify-serverless-functions-demo","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffrankiefab100%2Fnetlify-serverless-functions-demo/lists"}