[Add] README

LICENSE

@@ -0,0 +1,22 @@
+
+The MIT License (MIT)
+
+Copyright (c) 2020 LUA Development Studio
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

README.md

@@ -1,6 +1,21 @@
-## Create Project
+<div align="center">
+<img src='https://blog.wearelua.com/images/general/logo.png' title='LUA Logo' height='70' />
+<h1>LUApp® | cra-template</h1>
+<img src='https://img.shields.io/npm/v/cra-template-luapp?style=for-the-badge' title='NPM Version'/>
 
-npx:
+<img src='https://img.shields.io/badge/LUABuild-template-green?style=for-the-badge' title='NPM Version'/>
+
+<img src='https://img.shields.io/badge/PoweredBy-LUADevStudio-blue?style=for-the-badge' title='NPM Version'/>
+
+<p>LUApp it's a typescript cra-template with firebase, react-router, line-icons, react-snapshot, prettier and ts-lint for code linting, it also includes HOC for app strings like Android App structure.</p>
+</div>
+
+----
+
+## 🛠 Start building from our app template
+### • replace [project-name] with your app name
+
+yarn:
 ```
     npx create-react-app [project-name] --template luapp
 ```
@@ -10,7 +25,7 @@ npm:
     npm init react-app [project-name] --template luapp
 ```
 
-## Install Dependencies
+## 🔌 Install optional dependencies (prettier, tslint, react-snapshot)
 
 npm:
 ```
@@ -21,3 +36,89 @@ yarn:
 ```
     yarn config
 ```
+
+-----
+
+## 🏗 App Structure
+```
+|-- 📁 public/
+|   |-- 📑 index.html
+|   |-- 📜 manifest.json
+|   |-- 🤖 robots.txt
+|-- 📁 src/
+|   |-- 📚 Components/
+|   |   |-- 💻 App/
+|   |       |-- ⚛️ App.tsx
+|   |-- 🗃 Context/
+|   |    |-- 📦 MainContext.ts
+|   |-- 😀 Icons/
+|   |    |-- 🖌 Icons.css
+|   |    |-- 🅰️ LineIcons.woff2
+|   |-- 🔑 Keys/
+|   |    |-- 📦 firebase.ts
+|   |    |-- 🗝 keys.json
+|   |-- 🉐 Lang/
+|   |    |-- 📄 Strings.json
+|   |-- 🌎 LocalGlobals/
+|   |    |-- 📦 global.d.ts
+|   |-- 📖 Pages/
+|   |    |-- 📝 Index/
+|   |        |-- ⚛️ Index.tsx
+|   |-- 🖌 index.css
+|   |-- ⚛️ index.tsx
+|   |-- 📦 react-app-env.d.ts
+|   |-- 📦 serviceWorker.ts
+|-- ⚙️ .editorconfig
+|-- 💅🏽 .prettierrc
+|-- ⛔️ .gitignore
+|-- 🗳 tsconfig.json
+|-- 🎀 tslint.json
+```
+
+## 🤔 How it works
+### When you create a page you must create a folder on 📖 src/Pages and then edit 💻 src/Components/App to add the page on router. If you work on SPA (Single Page Application) just add components to 📝 Pages/Index/Index.tsx
+
+### When you write strings to your app, edit on 🉐 Lang/Strings.json and consume the strings from Context Provider, example:
+
+``` javascript
+// Pages/MyPage.tsx
+import React, { useContext } from 'react'
+import MainContext from '../Context/MainContext.ts'
+
+const MyPage:React.FC = () => {
+    const { lang } = useContext(MainContext)
+
+    return <h1>{ lang.hello }</h1>
+}
+```
+
+### IMPORTANT! Remember to edit ILangPackage interface on 🌎 LocalGlobals/global.d.ts to add strings on 🉐 Lang/Strings.json
+``` typescript
+// LocalGlobals/global.d.ts
+interface ILangs {
+    es: ILangPackage
+}
+
+interface ILangPackage {
+    hello: string
+}
+```
+
+``` typescript
+// Lang/Strings.json
+{
+    "es": {
+        "hello": "Hello World"
+    }
+}
+```
+
+----
+
+### This template it's very useful for large or complex projects with many developers, at LUA Development Studio all of our apps are written with this template.
+
+#### 'We use Context Api instead of Redux or MobX, just for performance"
+
+----
+## LICENSE MIT
+### All rights reserved LUA Development Studio ®

package.json

@@ -1,8 +1,14 @@
 {
   "name": "@weareluastudio/cra-template-luapp",
   "version": "0.1.9",
+  "description": "LUApp its a typescript cra-template with firebase, react-router, line-icons, react-snapshot, prettier and ts-lint for code linting, it also includes HOC for app strings like Android App structure.",
   "private": false,
+  "license": "MIT",
   "author": "LUA Development Studio",
+  "homepage": "https://github.com/weareluastudio/",
+  "repository": {
+    "url": "https://github.com/weareluastudio/cra-template-luapp"
+  },
   "main": "template.json",
   "keywords": [
     "react",
@@ -24,10 +30,12 @@
     "@types/node": "^12.0.0",
     "@types/react": "^16.9.0",
     "@types/react-dom": "^16.9.0",
+    "@types/react-router-dom": "^5.1.5",
+    "firebase": "^7.15.1",
     "react": "^16.13.1",
     "react-dom": "^16.13.1",
-    "react-scripts": "3.4.1",
-    "typescript": "~3.7.2"
+    "react-router-dom": "^5.2.0",
+    "react-scripts": "3.4.1"
   },
   "scripts": {
     "start": "react-scripts start",