Neelesh Pandey - @neeleshpandey
Krish Rathod - @KrishRathod
Ashutosh Singh- @Ashutosh5786
Ritesh Singh - @rootritesh
Anurag Singh - @Anu2arc
A Single place E-commerce Store where you can list multiple products to be purchased by customers This Project is built using Medusa, Next.js and Typescript. It includes products screen, cart, checkout and payment.
Before you start with the tutorial make sure you have
- Node.js v14 or greater installed on your machine
- Expo CLI
- Medusa server v14 or greater installed on your machine
- Stripe account
- Clone the repository:
git clone [email protected]:neeleshpandey/shoppy-store.git- Navigate into your projects directory and get your enviroment variables ready:
cd nextjs-starter-medusa/
mv .env.template .env.localUse Yarn to install all dependencies.
yarnYou are now ready to host your project
yarn devBy default the this starter supports the following payment integrations
To enable the integrations you need to add the following to your .env.local file:
MEDUSA_PAYMENT_STRIPE_PUBLIC_KEY=<your-stripe-public-key>
MEDUSA_PUBLIC_PAYPAL_CLIENT_ID=<your-paypal-client-id>
You will also need to setup the integrations in your Medusa server. See the Medusa documentation for more information on how to configure Stripe and PayPal in your Medusa project.
This starter is configured to support using the medusa-search-meilisearch plugin out of the box. To enable search you will need to enable the feature flag in ./store-config.json, which you do by changing the config to this:
{
"features": {
"search": true
}
}
Before you can search you will need to install the plugin in your Medusa server, for a written guide on how to do this – see our documentation.
The search components in this starter are developed with Algolia's react-instant-search-hooks-web library which should make it possible for you to seemlesly change your search provider to Algoli instead of MeiliSearch.
To do this you will need to add algoliasearch to the project, by running
yarn add algoliasearch
After this you will need to switch the current MeiliSearch SearchClient out with a Alogolia client. To do this update @lib/search-client.
import algoliasearch from "algoliasearch/lite"
const appId = process.env.NEXT_PUBLIC_SEARCH_APP_ID | "" // You should add this to your environment variables
const apiKey = process.env.NEXT_PUBLIC_SEARCH_API_KEY || "test_key"
const searchClient = algoliasearch(appId, apiKey)
export const SEARCH_INDEX_NAME =
process.env.NEXT_PUBLIC_INDEX_NAME || "products"After this you will need to set up Algolia with your Medusa server, and then you should be good to go. For a more thorough walkthrough of using Algolia with Medusa – see our documentation, and the doucmentation for using react-instantsearch-hooks-web.