Create your first BFC

The goal of this guide is to prepare your environment for developing a functioning BFC for a Poq app frontend.

Prerequisites

1. Install Git Client

2. Install NodeJS 14 LTS (Soon will be updated to the 16 LTS)

3. Install Yarn 1.22.x (Soon will be migrated)

   To accomplish further steps you must have access to the Poq resources, please contact the Poq Support Team.

   Resources you need to proceed are the following:

   • The Poq GitHub Poq.ApiTemplate.Node
   • NPM read-only token to access private registry to install SDK packages.

Project Setup

1. Clone Poq.ApiTemplate.Node.

   # Make sure you have all necessary rights to access it
   > git clone git@github.com:poqcommerce/Poq.ApiTemplate.Node.git
   
   # Move to cloned repository and you'll see.
   # ├── .git
   # ├── .gitignore
   # ├── .vscode
   # ├── NestJS.API.BFC
   # ├── PULL_REQUEST_TEMPLATE.md
   # └── README.md

   At the moment we support only NestJS SFCC BFC Template.

2. Move NestJS.API.BFC folder to your projects folder and rename it accordingly to the project name (e.g: Super Retailer BFC).

3. Update PROJECT NAME in README.md, package.json, Dockerfile.

4. Create .npmrc and put line there //registry.npmjs.org/:_authToken=__YOUR_TOKEN__ then add it to .gitignore.

   # Caution: Works on UNIX Systems
   # Creates .npmrc file with defined line and then append .gitignore with .npmrc
   > echo "//registry.npmjs.org/:_authToken=__YOUR_TOKEN__" > .npmrc && echo ".npmrc" >> .gitignore

5. Inside project folder install project dependencies via yarn install command.

6. Check whether everything is ok by running yarn lint:type && yarn build.

   NestJS BFC SFCC

   Explore files in the config folder. Any project requires appIdentifier, clientID (from OCAPI), baseUrl (OCAPI and the Poq platform).

   If there are any questions, please let us know.

7. Make sure configuration is in place, then start app via yarn start:dev.

   Congratulations!

   If all the steps are done so far, then you're ready for BFC development.

   Default App includes everything to handle default mobile client as is.

Setup Mobile client (Optional)

It's useful for developers to connect your local BFC server with mobile to check their interaction and connect all the dots.

1. Request for distributive of the mobile client (IOS or Android);
2. Install Charles proxy;

• Configure it for iOS: How-To-Charles-Proxy-IOS;
• Or for Android: How-To-Charles-Proxy-Android;

3. Charles can rewrite target urls (use this function to forward requests from a mobile device to a local machine aka local BFC);

   

4. After you're clicking on Rewrite, then use URL and values as depicted below.

   

   Congratulations!

   If all the steps are done so far, your mobile client should work in conjunction with BFC on local machine.