Edit docs and add comments to code

README.md

@@ -15,9 +15,8 @@ If you just want to get the app running quickly to test it out, first install
 ```sh
 git clone git@github.com:sharetribe/flex-template-web.git      # clone this repository
 cd flex-template-web/                                          # change to the cloned directory
-cp .env-template .env                                          # copy the env template file to add your local config
-emacs .env                                                     # in your favorite editor, add the mandatory env vars to the config
 yarn install                                                   # install dependencies
+yarn run config                                                # add the mandatory env vars to your local config
 yarn run dev                                                   # start the dev server, this will open a browser in localhost:3000
 ```
 

docs/customization-guide.md

@@ -80,17 +80,24 @@ In the `master` branch (or in the branch you want to merge in the upstream chang
 
 See also the [Syncing a fork](https://help.github.com/articles/syncing-a-fork/) documentation.
 
+## Installing dependecies
+
+In your project root, install dependencies:
+
+    yarn install
+
 ## Configuration
 
 There are some mandatory configuration, and some configuration that you most likely want to at least
 go through.
 
-To get started, first copy the config template:
+To get started, run:
 
-    cp .env-template .env
+    yarn run config
 
-The `.env` file is the place to add your local configuration. It is ignored in Git, so you'll have
-to add the corresponding configuration also to your server environment.
+This command will create `.env` file and guide you trough setting up the required environment
+variables. The `.env` file is the place to add your local configuration. It is ignored in Git, so
+you'll have to add the corresponding configuration also to your server environment.
 
 There are some mandatory configuration variables that are defined in the template. See the
 [Environment configuration variables](env.md) documentation for more information.
@@ -99,10 +106,6 @@ See also the [src/config.js](../src/config.js) file for more configuration optio
 
 ## Development
 
-In your project root, install dependencies:
-
-    yarn install
-
 To develop the application and to see changes live, start the frontend development server:
 
     yarn run dev

docs/env.md

@@ -28,8 +28,9 @@ them have defaults that work for development environment. For production deploys
 ## Defining configuration
 
 When the app is started locally with `yarn run dev` or `yarn run dev-server`, you can set
-environment variables by using the (gitignored) `.env` file. The repository contains a template file
-`.env-template` with default configuration. Just copy that as `.env` and edit as necessary.
+environment variables by using the (gitignored) `.env` file. You can edit the basic variables via
+`yarn run config` or by editing directly the .env file. Some variables can be edited only in the
+.env file. The repository contains a template file `.env-template` with default configuration.
 
 In production, it's recommended that you set the configuration via env variables and do not deploy
 an .env file. The client application will only be packaged with env variables that start with

scripts/config.js

@@ -53,6 +53,9 @@ Remember to restart the application after editing the environment variables! You
           const settings = findSavedValues();
           askQuestions(settings);
         }
+      })
+      .catch(err => {
+        console.log(chalk.red(`An error occurred due to: ${err.message}`));
       });
   } else {
     inquirer
@@ -84,8 +87,12 @@ We recommend setting up the required variables before starting the application!`
 
 /**
  * Questions for mandatory variables.
+ * If some values already exist in the .env file use them as a default.
+ * Otherwise don't use default value in the questions.
  *
- * @param {*} settings - list of values used as default if user is editing the .env file
+ * @param {array} settings - array of values used as default if user is editing the .env file
+ *
+ * @returns array of questions passed to Inquirer
  *
  */
 const mandatoryVariables = settings => {
@@ -176,8 +183,12 @@ ${chalk.dim(
 
 /**
  * Questions for advances variables. User can choose to edit these or not.
+ * If some values already exist in the .env file use them as a default.
+ * Otherwise don't use default value in the questions.
  *
- * @param {*} settings - list of values used as default if user is editing the .env file
+ * @param {array} settings - array of values used as default if user is editing the .env file
+ *
+ * @returns array of questions passed to Inquirer
  *
  */
 
@@ -241,6 +252,14 @@ ${chalk.dim(
   ];
 };
 
+/**
+ * First ask mandatory variables and then check if user also wants to edit the advanced settings.
+ * Update the .env file with user input.
+ *
+ * @param {array} settings - array of values used as default if user is editing the .env file
+ *
+ */
+
 const askQuestions = settings => {
   inquirer
     .prompt(mandatoryVariables(settings))
@@ -268,6 +287,9 @@ const askQuestions = settings => {
     });
 };
 
+/**
+ * Show succes message used after creating the .env file
+ */
 const showSuccessMessage = () => {
   console.log(`
 ${chalk.green.bold('.env file saved succesfully!')} 
@@ -289,6 +311,11 @@ const createEnvFile = () => {
   });
 };
 
+/**
+ * Get the saved values from .env file so they can be used as a default values
+ *
+ * @return array containing all keys and values saved to .env file
+ */
 const findSavedValues = () => {
   const savedEnvFile = fs.readFileSync('./.env').toString();
 
@@ -335,6 +362,14 @@ const readLines = answers => {
   });
 };
 
+/**
+ *
+ * Creates array of data that is saved to .env file
+ *
+ * @param {object} values contais lines read from .env file and answers from the user
+ *
+ * @returns array containing the data that needs to be saved to .env file
+ */
 const getData = values => {
   const { lines, answers } = values;
 
@@ -351,6 +386,11 @@ const getData = values => {
   return data;
 };
 
+/**
+ * Joins lines to create content that is written to .env file. This will overwrite the previous content.
+ *
+ * @param {array} data arry of lines to be written into .env file
+ */
 const updateEnvFile = data => {
   fs.writeFileSync('./.env', data.join(''));
 };