Day 2 Activities: Transitioning to Technical Planning

Step 1: Define Technical Requirements

• Frontend Requirements
  • User Friendly interface for browsing, adding to cart and checkout.
  • NextJS for frontend
  • Responsiveness across all devices.
  • Performance should be better by loading each page within a second.
• Backend Requirements (Sanity CMS)
  • Management of inventory, users, orders etc using backend of Sanity.
  • Sanity is acting as backend and database also.
• Third-Party APIs:
  • Shipment API for tracking order.
  • Stripe as a payment service provider.

Step2: Design System Architecture

Key WorkFlows:

1. Product Purchase:
   • User browses and selects a product.
   • User adds items to the cart.
   • User proceeds to checkout and enters shipping details.
   • Backend verifies product availability.
   • Payment is processed using Stripe.
   • Order is confirmed, and shipment details are generated.
   • User receives an order confirmation and tracking information.

WorkFlow/Activity Diagram

1. User/Admin Login:
   • User enters credentials.
   • Frontend sends credentials to backend for verification.
   • Backend authenticates user.
   • A session or token is created.
   • User gains access to the system.

WorkFlow/Activity Diagram

1. Admin Product Management:
   • Admin logs into the system.
   • Admin views or adds products via a management interface.
   • Changes are sent to Sanity CMS for update or creation.
   • Sanity CMS confirms data update.
   • Admin views confirmation of the action.

WorkFlow/Activity Diagram: