Merge pull request #154 from GuiDevloper/add-docs-0-12

Update references to app-start and v0.12 details EN/BR

i18n/en-US/articles/context-project.md

@@ -13,11 +13,9 @@ It gives you information about the app manifest and some metatags.
 
 `project` keys will be used to generate metatags during server-side rendering and must be assigned before [`initiate`](/full-stack-lifecycle) is resolved.
 
-`project` keys will be used to generate the app **manifest** and should be set during the [application startup](/application-startup).
+`project` keys will be used to generate the app **manifest**.
 
-The `disallow` key will be used to generate the **robots.txt** and should be set during the [application startup](/application-startup).
-
-`project` keys are frozen after the [application startup](/application-startup).
+The `disallow` key will be used to generate the **robots.txt**.
 
 The following keys are available in the object and supported as environment variables as follows:
 
@@ -40,7 +38,7 @@ The following keys are available in the object and supported as environment vari
 
 Besides `domain`, `name` and `color` all other keys have sensible defaults generated based on the application scope.
 
-If you do not declare the `icons` key, Nullstack will scan any icons with the name following the pattern "icon-[WIDTH]x[HEIGHT].png" in your public folder.
+If you do not declare the `icons` key, Nullstack will scan any icons with the name following the pattern "icon-[WIDTH]x[HEIGHT].png" in your **public** folder.
 
 If the `sitemap` key is set to true your **robots.txt** file will point the sitemap to `https://${project.domain}/sitemap.xml`.
 
@@ -49,32 +47,46 @@ The `cdn` key will prefix your asset bundles and will be available in the contex
 The `protocol` key is "http" in development mode and "https" in production mode by default.
 
 ```jsx
+// server.js
 import Nullstack from 'nullstack';
+import Application from './src/Application';
+
+const context = Nullstack.start(Application);
+
+context.start = function() {
+  const { project } = context;
+  project.name = 'Nullstack';
+  project.shortName = 'Nullstack';
+  project.domain = 'nullstack.app';
+  project.color = '#d22365';
+  project.backgroundColor = '#d22365';
+  project.type = 'website';
+  project.display = 'standalone';
+  project.orientation = 'portrait';
+  project.scope = '/';
+  project.root = '/';
+  project.icons = {
+    '72': '/icon-72x72.png',
+    '128': '/icon-128x128.png',
+    '512': '/icon-512x512.png'
+  };
+  project.favicon = '/favicon.png';
+  project.disallow = ['/admin'];
+  project.sitemap = true;
+  project.cdn = 'cdn.nullstack.app';
+  project.protocol = 'https';
+}
 
-class Application extends Nullstack {
+export default context;
+```
 
-  static async start({project}) {
-    project.name = 'Nullstack';
-    project.shortName = 'Nullstack';
-    project.domain = 'nullstack.app';
-    project.color = '#d22365';
-    project.backgroundColor = '#d22365';
-    project.type = 'website';
-    project.display = 'standalone';
-    project.orientation = 'portrait';
-    project.scope = '/';
-    project.root = '/';
-    project.icons = {
-      '72': '/icon-72x72.png',
-      '128': '/icon-128x128.png',
-      '512': '/icon-512x512.png'
-    };
-    project.favicon = '/favicon.png';
-    project.disallow = ['/admin'];
-    project.sitemap = true;
-    project.cdn = 'cdn.nullstack.app';
-    project.protocol = 'https';
-  }
+> More about the `context.start` at [application startup](/application-startup)
+
+```jsx
+// src/Application.njs
+import Nullstack from 'nullstack';
+
+class Application extends Nullstack {
 
   prepare({project, page}) {
     page.title = project.name;

i18n/en-US/articles/context-secrets.md

@@ -10,31 +10,32 @@ description: The secrets object is a proxy in the Nullstack Context available in
 
 You can use it to configure your application with private information.
 
-`secrets` keys are frozen after the [application startup](/application-startup).
+You can assign any keys with any type to the object.
 
-The following keys are available in the object:
+You can assign keys to `secrets` dynamically based on current environment using [`context.environment`](/context-environment).
 
-- **development**: `object`
-- **production**: `object`
-- **[anySetting]**: `any`
+```jsx
+// server.js
+import Nullstack from 'nullstack';
+import Application from './src/Application';
 
-You can assign keys to `development` or `production` keys in order to have different secrets per [environment](/context-environment).
+const context = Nullstack.start(Application);
 
-If you assign a key directly to the `secrets` object it will be available in both environments.
+context.start = function() {
+  const { secrets, environment } = context;
+  secrets.endpoint = 'https://domain.com/api';
+  secrets.privateKey = environment.development ? 'DEV_API_KEY' : 'PROD_API_KEY';
+}
 
-When reading from a key you must read directly from the `secrets` object and Nullstack will return the best-suited value for that [environment](/context-environment).
+export default context;
+```
 
 ```jsx
+// src/Application.njs
 import Nullstack from 'nullstack';
 
 class Application extends Nullstack {
 
-  static async start({secrets}) {
-    secrets.development.privateKey = 'SANDBOX_API_KEY';
-    secrets.production.privateKey = 'PRODUCTION_API_KEY';
-    secrets.endpoint = 'https://domain.com/api';
-  }
-
   static async fetchFromApi({secrets}) {
     const response = await fetch(secrets.endpoint, {
       headers: {
@@ -49,7 +50,7 @@ class Application extends Nullstack {
 export default Application;
 ```
 
-Any environment key starting with NULLSTACK_SECRETS_ will be mapped to the secrets in that environment.
+Any environment variable starting with NULLSTACK_SECRETS_ will be mapped to the `secrets` in that environment.
 
 > 🐱‍💻 NULLSTACK_SECRETS_PRIVATE_KEY will be mapped to `secrets.privateKey`
 

i18n/en-US/articles/context-settings.md

@@ -11,31 +11,32 @@ description: The settings object is a proxy in the Nullstack Context available i
 
 You can use it to configure your application with public information.
 
-`settings` keys are frozen after the [application startup](/application-startup).
+You can assign any keys with any type to the object.
 
-The following keys are available in the object:
+You can assign keys to `settings` dynamically based on current environment using [`context.environment`](/context-environment).
 
-- **development**: `object`
-- **production**: `object`
-- **[anySetting]**: `any`
+```jsx
+// server.js
+import Nullstack from 'nullstack';
+import Application from './src/Application';
 
-You can assign keys to `development` or `production` keys in order to have different settings per [environment](/context-environment).
+const context = Nullstack.start(Application);
 
-If you assign a key directly to the `settings` object it will be available in both environments.
+context.start = function() {
+  const { settings, environment } = context;
+  settings.endpoint = 'https://domain.com/api';
+  settings.privateKey = environment.development ? 'DEV_API_KEY' : 'PROD_API_KEY';
+}
 
-When reading from a key you must read directly from the `settings` object and Nullstack will return the best-suited value for that [environment](/context-environment).
+export default context;
+```
 
 ```jsx
+// src/Application.njs
 import Nullstack from 'nullstack';
 
 class Application extends Nullstack {
 
-  static async start({settings}) {
-    settings.development.publicKey = 'SANDBOX_API_KEY';
-    settings.production.publicKey = 'PRODUCTION_API_KEY';
-    settings.endpoint = 'https://domain.com/api';
-  }
-
   async hydrate({settings}) {
     const response = await fetch(settings.endpoint, {
       headers: {
@@ -50,7 +51,7 @@ class Application extends Nullstack {
 export default Application;
 ```
 
-Any environment key starting with NULLSTACK_SETTINGS_ will be mapped to the settings in that environment.
+Any environment variable starting with NULLSTACK_SETTINGS_ will be mapped to the `settings` in that environment.
 
 > 🐱‍💻 NULLSTACK_SETTINGS_PUBLIC_KEY will be mapped to `settings.publicKey`
 

i18n/en-US/articles/context.md

@@ -81,7 +81,7 @@ import Counter from './Counter';
 
 class Application extends Nullstack {
 
-  static async start(context) {
+  prepare(context) {
     context.totalCount = 0;
   }
 

i18n/en-US/articles/getting-started.md

@@ -7,7 +7,7 @@ description: Create full-stack JavaScript applications within seconds
 
 Create full-stack JavaScript applications within seconds using `npx` to generate your project files from the latest template.
 
-> 🔥 The minimum required [node.js](https://nodejs.org) version for development mode is *12.12.0*.
+> 🔥 The minimum required [node.js](https://nodejs.org) version for development mode is *12.20.0*.
 
 > ⚠ If the directory you are in contains spaces, you use Windows and `npx` gives errors, read about [the known npx bug](#the-known-npx-bug).
 
@@ -39,11 +39,17 @@ npm start
 
 The following folders and files will be generated:
 
-### index.js
+### server.js
 
-This is the [Webpack](https://webpack.js.org) entry point.
+This is the server entry and generator point.
 
-Usually, you don't have to touch this file, but it is a convenient place to import global dependencies like CSS frameworks.
+It is a convenient place to set up global things like [database](/how-to-use-mongodb-with-nullstack) and manipulate server `context`, details in [application startup](/application-startup).
+
+### client.js
+
+This is the client entry and generator point.
+
+It is a convenient place to import global dependencies like CSS frameworks and manipulate client `context`.
 
 ### src/
 
@@ -55,7 +61,7 @@ This is your application main file.
 
 >✨ Learn more about the [njs file extension](/njs-file-extension "Nullstack JavaScript").
 
-The `start` function will be automatically called once when you run `npm start`, use it to populate your server [context](/context) with things like [database](/how-to-use-mongodb-with-nullstack), [settings](/context-settings), and [secrets](/context-secrets).
+When you run `npm start` it is consumed in **server**/**client** JS files by their `Nullstack.start` function, which starts and returns both [`context`](/context), that you can use to set up things like [database](/how-to-use-mongodb-with-nullstack) using [settings](/context-settings) and [secrets](/context-secrets).
 
 >✨ Learn more about the [application startup](/application-startup).
 

i18n/en-US/articles/how-to-use-mongodb-with-nullstack.md

@@ -25,25 +25,21 @@ NULLSTACK_SECRETS_DATABASE_NAME="dbname"
 The last step is to simply assign the database connection to the server context.
 
 ```jsx
+// server.js
 import Nullstack from 'nullstack';
-import {MongoClient} from 'mongodb';
+import Application from './src/Application';
+import { MongoClient } from 'mongodb';
 
-class Application extends Nullstack {
-
-  static async start(context) {
-    await this.startDatabase(context);
-  }
-
-  static async startDatabase(context) {
-    const {secrets} = context;
-    const databaseClient = new MongoClient(secrets.databaseUri);
-    await databaseClient.connect();
-    context.database = await databaseClient.db(secrets.databaseName);
-  }
+const context = Nullstack.start(Application);
 
+context.start = async function() {
+  const { secrets } = context;
+  const databaseClient = new MongoClient(secrets.databaseUri);
+  await databaseClient.connect();
+  context.database = await databaseClient.db(secrets.databaseName);
 }
 
-export default Application;
+export default context;
 ```
 
 The example above will make the `database` key available to all your server functions.

i18n/en-US/articles/server-request-and-response.md

@@ -23,21 +23,17 @@ The following functions are tunneled back to the Express server:
 > ✨ If you wanna know how to make an API with Nullstack, this is the way.
 
 ```jsx
+// server.js
 import Nullstack from 'nullstack';
+import Application from './src/Application';
 
-class Application extends Nullstack {
-
-  static async start({server}) {
-    server.get('/api/books', (request, response) => {
-      response.json({books: []});
-    });
-  }
+const context = Nullstack.start(Application);
 
-  // ...
+context.server.get('/api/books', (request, response) => {
+  response.json({books: []});
+});
 
-}
-
-export default Application;
+export default context;
 ```
 
 Other available keys are:
@@ -47,24 +43,21 @@ Other available keys are:
 - **cors**: `object`
 
 ```jsx
+// server.js
 import Nullstack from 'nullstack';
+import Application from './src/Application';
 
-class Application extends Nullstack {
-
-  static async start({server}) {
-    server.port = 3000;
-    server.maximumPayloadSize = '5mb';
-    server.cors = {
-      origin: 'http://localhost:6969',
-      optionsSuccessStatus: 200
-    }
-  }
-
-  // ...
+const context = Nullstack.start(Application);
 
+const { server } = context;
+server.port = 3000;
+server.maximumPayloadSize = '5mb';
+server.cors = {
+  origin: 'http://localhost:6969',
+  optionsSuccessStatus: 200
 }
 
-export default Application;
+export default context;
 ```
 
 The `cors` object will be passed as the argument to [express cors plugin](https://expressjs.com/en/resources/middleware/cors.html).