Free Netlify quickstart recipe libary app using Next.js, Prisma and Aiven. Recipe data is from kaggle.
The application is a recipe library where you can browse and inspect recipes. Additionally, you can like recipes that seem interesting and filter list to show only liked ones. Furthermore, you can see interesting statistics from all of the recipes and those that are liked.
MySQL is used as the data storage for storing all recipes and whether they are liked or not. Aiven for Caching is optional, but when configured statistics are cached to offer faster response time. The database response times are shown in the app to demonstrate the difference. You can get free services with Aiven for MySQL and Aiven for Caching by signing up.
The application is designed to be hosted on serverless application platform Netlify, which has amazing support for hosting Next.js applications.
The app requires MySQL database. Configuring Aiven for Caching is optional, but highly recommended to demonstrate all features of the application and the benefits of having a Caching as part of your application. Using us-east-1
region is recommended to minimise latency, as this region will be closest to where the Netlify functions are deployed if using their free plan.
Get free Aiven for MySQL and Aiven for Caching from Aiven.
You can fork this branch and deploy the application immediately to Netlify by clicking the button below. Database migrations and seed is done during the Netlify deployment process. Make sure you have MySQL database up and running when deploying to achieve working environment on the first try.
- Install Node version 18
- Copy .env.template as .env and set DATABASE_URL and REDIS_URI
- Install the packages:
npm ci
- Setup the database by running:
npm run reset-db
- Start the development server:
npm run dev
- Go to http://localhost:3000 and head to browse the recipes
Congratulations you can now start developing. The page reloads automatically as you make changes.
- Reset the database:
npm run reset-db
- Run the development server:
npm run dev
- Run eslint:
npm run eslint
- Run prettier format:
npm run format
You can fork this branch and deploy the application immediately to Netlify by clicking the button below. Database migrations and seed is done during the Netlify deployment process. Make sure you have MySQL database up and running when deploying to achieve working environment on the first try.
-
Install packages:
npm ci
-
Login with the cli to obtain token:
npx netlify login
-
Start and follow the automated setup process:
npx netlify init
Choose to create a new site, and then select the default options other prompts. You will be required to authorize Netlify with GitHub.
-
Open site admin UI in Netlify:
npx netlify open --admin
-
Go to site configuration section and add environment variables for MySQL and Aiven for Caching. Check .env.template for the keys.
-
Go to deploys section and trigger the deployment by clicking
Trigger deploy
-button. -
Access the app from command line with
npx netlify open --site
or open the site from the Netlify admin UI.
You can now push changes and your changes will be automatically deployed to your site.
nextjs-netlify-mysql is licensed under the Apache license, version 2.0. Full license text is available in the LICENSE file.
Please note that the project explicitly does not require a CLA (Contributor License Agreement) from its contributors.
Bug reports and patches are very welcome, please post them as GitHub issues and pull requests at https://github.com/Aiven-Labs/nextjs-netlify-mysql.