๐ฌ Newsletter Subscription App
This is a web application that allows users to subscribe to newsletters that are focussed on different topics. The web app has two pages which are:
- Subscription Page which allows users to fill a subscription form with basic personal details and select newsletter categories
- Subscription List Page which allows users to view all submitted subscriptions and filter subscriptions by category.
๐๏ธ Basic Repository Folder Structure
story-blok-newsletter-subscription-application/
โโโ api/
โ โโโ app/
โ โ โโโ controllers/
โ โ โ โโโ v1/
โ โ โ โโโ categories_controller.rb
โ โ โ โโโ subscriptions_controller.rb
โ โ โโโ models/
โ โ โ โโโ category.rb
โ โ โ โโโ customer.rb
โ โ โ โโโ subscription.rb
โ โ โโโ services/
โ โ โ โโโ category_service.rb
โ โ โ โโโ subscription_service.rb
โ โโโ spec/
โ โ โโโ controllers/
โ โ โโโ models/
โ โ โโโ services/
โ โ โโโ factories/
โ โโโ Dockerfile
โ โโโ docker-compose.yml
โ
โโโ frontend/
โ โโโ src/
โ โ โโโ main.ts
โ โ โโโ pages/
โ โ โ โโโ subscription/
โ โ โ โโโ components/
โ โ โ โ โโโ SubscriptionForm.vue
โ โ โ โ โโโ SubscriptionList.vue
โ โ โ โโโ service/
โ โ โ โ โโโ category.ts
โ โ โ โ โโโ subscription.ts
โ โ โ โโโ helpers/
โ โ โ โ โโโ constants.ts
โ โ โ โ โโโ validation.ts
โ โ โ โโโ types/
โ โโโ __tests__/
โ โโโ SubscriptionForm.test.ts
โ โโโ SubscriptionList.test.ts
โ โโโ utils/
โ โโโ categories-mock-data.ts
โ โโโ subscription-list-mock-data.ts
โ โโโ utils.ts
โ
โโโ README.md
๐ Getting Started
Prerequisites
Docker: You must have either docker desktop or orb stack (recommended) installed. Note that orb stack only works on mac and linux.
Node: with version greater than or equal to 20.10.0
โ๏ธ Setup
- Navigate to the root directory of the api folder.
- Run
docker compose build --no-cache to build the containers.
- Run
docker compose run --rm api bundle install to install the gem packages.
- Run
docker compose run --rm api rails db:migrate to migrate the database.
- Run
docker compose up api -d to start the containers.
- Launch http://localhost:3000 on your browser to confirm that the API server is running.
- Navigate to the root directory of the frontend folder.
- Run
npm install to install dependencies.
- Run
npm run dev to start the development server.
- Launch http://localhost:5173/subscription on your browser to confirm that the frontend server is running.
- The create subscription page url is http://localhost:5173/subscription, while the subscription list page url is http://localhost:5173/subscription/list
๐งช Running Tests
Backend Tests
- Navigate to the root directory of the api folder.
- Run
docker compose up test to run the tests.
Frontend Tests
- Navigate to the root directory of the frontend folder.
- Run
npm run test to run the tests.