Random Recipe Generator V2

Random Recipe Generator is an interactive web application that generates random recipes for users. Users can choose the origin and category from lists and click on a button in order to generate random recipes, which are sourced from TheMealDB API. The application provides a user interface with recipe pictures, recipe names, origin, categorie, ingredient lists, step-by-step cooking instructions, and sometimes cooking videos.

Frameworks Used

• Vue3
• Pinia
• Vuetify3
• Nuxt3

Screenshots

# #

TO-DO

• Style the RandomRecipeForm.vue component

Setup

Make sure to install the dependencies:

# npm
npm install

# pnpm
pnpm install

# yarn
yarn install

# bun
bun install

Development Server

Start the development server on http://localhost:3000:

# npm
npm run dev

# pnpm
pnpm run dev

# yarn
yarn dev

# bun
bun run dev

Production

Build the application for production:

# npm
npm run build

# pnpm
pnpm run build

# yarn
yarn build

# bun
bun run build

Locally preview production build:

# npm
npm run preview

# pnpm
pnpm run preview

# yarn
yarn preview

# bun
bun run preview

Check out the deployment documentation for more information.