Scribd Logo
Upload

Welcome to Scribd!

  • 189 views

    Pickbazar Documentation: Admin Dashboard

    Uploaded by

    messi
    This document provides instructions for getting started with and deploying an e-commerce template built with React, NextJS, TypeScript, GraphQL, and other technologies. It consists of three main parts: an Admin Dashboard, Shop, and API. The template uses a monorepo structure and provides commands for starting each section locally for development. It also provides instructions for configuring and deploying each section to Vercel for production hosting.

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd

    Pickbazar Documentation: Admin Dashboard

    Uploaded by

    messi
    189 views5 pages
    This document provides instructions for getting started with and deploying an e-commerce template built with React, NextJS, TypeScript, GraphQL, and other technologies. It consists of three main parts: an Admin Dashboard, Shop, and API. The template uses a monorepo structure and provides commands for starting each section locally for development. It also provides instructions for configuring and deploying each section to Vercel for production hosting.

    Original Description:

    templates

    Original Title

    Documentation

    Copyright

    © © All Rights Reserved

    Available Formats

    PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    This document provides instructions for getting started with and deploying an e-commerce template built with React, NextJS, TypeScript, GraphQL, and other technologies. It consists of three main parts: an Admin Dashboard, Shop, and API. The template uses a monorepo structure and provides commands for starting each section locally for development. It also provides instructions for configuring and deploying each section to Vercel for production hosting.

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Download as pdf or txt
    189 views5 pages

    Pickbazar Documentation: Admin Dashboard

    Uploaded by

    messi
    This document provides instructions for getting started with and deploying an e-commerce template built with React, NextJS, TypeScript, GraphQL, and other technologies. It consists of three main parts: an Admin Dashboard, Shop, and API. The template uses a monorepo structure and provides commands for starting each section locally for development. It also provides instructions for configuring and deploying each section to Vercel for production hosting.

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Download as pdf or txt
    You are on page 1of 5

    README.

    md 7/30/2020

    PickBazar Documentation
    Introduction
    Fastest E-commerce template built with React, NextJS, TypeScript, GraphQL, Type-GraphQL & Styled-
    Components. Its very easy to use, we used graphql and type-graphql, you can build your schema very easily.
    GraphQL playground makes itʼs own documentation, your frontend team will love using it.
    Tech We Have Used
    We have used monorepo folder structure with Yarn Workspace. In our template we have three different part
    Admin Dashboard, Shop and API. Tech specification for specific part is given below
    Admin Dashboard
    CRA
    Apollo
    BaseUI
    Typescript
    React Hook Form
    Shop
    NextJs
    Apollo
    Typescript
    Styled Components
    Stripe Integration
    Formik
    API
    GraphQL
    Type GraphQL
    Shop {REST: API} Integration
    SWR
    NextJs
    Typescript ...

    1/5
    README.md 7/30/2020

    Getting Started & Installation


    For getting started with the template you have to follow the below procedure. First navigate to the pickbazar
    directory. Then run below command for getting started with specific part.

    # on pickbazar directory
    yarn

    Admin
    For starting the admin dashboard part with corresponding api data run below commands.

    # for dev mode run below command


    yarn dev:admin

    Shop
    Configuration
    . Go to /packages/shop folder.
    . Copy the contents of .env.local.sample into a new file called .env.local
    . Put Your Stripe public api key in the /packages/shop/.env.local file's
    NEXT_PUBLIC_STRIPE_PUBLIC_KEY key.

    For starting the shop part with corresponding api run below commands.

    # for dev mode run below command


    yarn dev:shop

    Shop Rest
    Configuration
    . Go to /packages/shop-rest folder.
    . Copy the contents of .env.local.sample into a new file called .env.local
    . Put Your Stripe public api key in the /packages/shop-rest/.env.local file's
    NEXT_PUBLIC_STRIPE_PUBLIC_KEY key.

    2/5
    README.md 7/30/2020

    For starting the shop-rest part with corresponding api run below commands.

    # for dev mode run below command


    yarn dev:shop-rest

    NOTE: For shop-rest we didn't provide any actual rest api integration we
    use SWR hook pattern and fetch data from public json. you need to edit
    those hook to integrate your actual API end point. please go to
    packages/shop-rest/src/data folder for those hooks. also need to
    implement load more functionality by your self.
    If you want to test your production build admin or shop in local environment then run the below
    commands.
    Admin
    # build admin for production
    yarn build:admin

    # build api which in needed for local testing


    yarn build:api

    #start admin in production mode


    yarn serve:admin

    Shop
    # build shop for production
    yarn build:shop

    # build api which in needed for local testing


    yarn build:api

    # start shop in production mode


    yarn serve:shop

    3/5
    README.md 7/30/2020

    Folder Structure & Customization


    /packages/admin : In this portion all the admin dashboard related coding and functions.
    /packages/shop : All the shop related coding and functions.

    /packages/api : API related code for both admin and shop section.

    admin related api codes are in admin folder


    shop related codes are in shop folder
    Configuration & Deployment
    vercel.com (previously known as now.sh)
    If you want to host the template in vercel.com then follow the below command
    API
    Navigate to packages/api
    Now run below command

    vercel

    Admin
    After deploying the api you will get the api endpoint url. Put that url in the packages/admin/.env
    also need to put it within vercel.json .

    REACT_APP_API_URL={put_your_api_url_here}/admin/graphql;

    Navigate to packages/admin
    Now run below command

    4/5
    README.md 7/30/2020

    vercel

    Shop
    After deploying the api you will get the api endpoint url. Put that url in the
    packages/shop/.env.local and vercel.json file.

    NEXT_PUBLIC_STRIPE_PUBLIC_KEY= 'put_your_stripe_public_key'

    NEXT_PUBLIC_GRAPHQL_API_ENDPOINT= '{put_your_api_url_here.}/shop/graphql'

    Navigate to packages/shop
    Now run below command

    vercel

    Shop Rest
    Note: Please follow the above (shop) deployment procedure.
    NOTE: for deploying to vercel you need to install vercel-cli on your
    machine for more information please visit here
    ** Note ** For more details information please visit our online documentation here

    5/5

    You might also like

    pFad - Phonifier reborn

    Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

    Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


    Alternative Proxies:

    Alternative Proxy

    pFad Proxy

    pFad v3 Proxy

    pFad v4 Proxy