A system where customers can pay to watch videos(movies) based on a daily, monthly, or yearly subscription,
- Laravel for Backend
- VueJS for frontend
- Laravel Sanctum for API Auth
- Using the TheMovieDB(TMDB) Movie API
- Stripe Payment Gateway for the subscription
Stripe Payment Gateway: https://stripe.com/en-gb-us (MUST BE REGISTERED TO GET YOUR PUBLISH KEY AND SECRET KEY AND TO CREATE SUBSCRIPTION)
TMDB API: https://www.themoviedb.org/settings/api (MUST BE REGISTERED TO VIEW THIS PAGE TO GET YOUR API KEY AND TOKEN)
In your .env
file
# Your database details here
DB_CONNECTION=mysql
DB_HOST=localhost
DB_PORT=3306
DB_DATABASE=moviesapp
DB_USERNAME=root
DB_PASSWORD=
# Your API details
TMDB_TOKEN=***__***
TMDB_BEARER=***__***
STRIPE_KEY=pk_test_***__***
STRIPE_SECRET=sk_test_***__***
composer update
php artisan migrate
npm install
Laravel UI: Used to setup Vue
Main Docs: https://laravel.com/docs/7.x/frontend
Laravel Sanctum: For the authentication
Main Docs: https://laravel.com/docs/8.x/sanctum
Laravel Cashier: For the payment/subscription (Easy integration with Stripe)
Main Docs: https://laravel.com/docs/8.x/billing
Tailwind CSS: Used for the Frontend UI
Main Docs: https://tailwindcss.com/docs/installation
npm install tailwindcss postcss autoprefixer
PostCSS 7 compatibility build
Error: PostCSS plugin tailwindcss requires PostCSS 8.
npm uninstall tailwindcss postcss autoprefixer
npm install tailwindcss@npm:@tailwindcss/postcss7-compat postcss@^7 autoprefixer@^9
Alpine.js: For event handling on the search form (probably not necessary!) - I just like it.
<script
src="https://cdn.jsdelivr.net/gh/alpinejs/[email protected]/dist/alpine.min.js"
defer
></script>