Merge pull request #88 from nearprotocol/project-name

Replace contract name in src/config.js based on folder name

blank_project/README.md

@@ -11,22 +11,54 @@
 ## Template for NEAR dapps
 ### Requirements
 ##### IMPORTANT: Make sure you have the latest version of NEAR Shell and Node Version > 10.x 
-1. node and npm
-2. near shell
+
+1. [Node.js](https://nodejs.org/en/download/package-manager/)
+2. (optional) near-shell
+
 ```
 npm i -g near-shell
 ```
-3.(optional) install yarn to build
+3. (optional) yarn
 ```
 npm i -g yarn
 ```
 ### To run on NEAR testnet
-#### Step 1: Create account for the contract and deploy the contract.
+
+```bash
+npm install && npm dev
+```
+
+with yarn:
+
+```bash
+yarn && yarn dev
+```
+
+The server that starts is for static assets and by default serves them to http://localhost:1234. Navigate there in your browser to see the app running!
+
+NOTE: Both contract and client-side code will auto-reload once you change source files.
+
+### To run tests
+
+```bash
+npm test
+```
+
+with yarn:
+
+```bash
+yarn test
+```
+
+### Deploy
+
+#### Step 1: Create account for the contract
+
 You'll now want to authorize NEAR shell on your NEAR account, which will allow NEAR Shell to deploy contracts on your NEAR account's behalf \(and spend your NEAR account balance to do so\).
 
 Type the command `near login` which should return a url:
 
-```bash
+```
 Please navigate to this url and follow the instructions to log in:
 https://wallet.nearprotocol.com/login/?title=NEAR+Shell&public_key={publicKey}
 ```
@@ -43,34 +75,36 @@ Once you have entered your account ID, it will display the following message:
 This message is not an error, it just means that it will create a public key for you.
 
 #### Step 2:
-Modify src/config.js line that sets the contractName. Set it to id from step 1.
+
+Modify `src/config.js` line that sets the account name of the contract. Set it to the account id from step 1.
+
+NOTE: When you use [create-near-app](https://github.com/nearprotocol/create-near-app) to create the project it'll infer and pre-populate name of contract based on project folder name.
+
 ```javascript
-(function() {
-    const CONTRACT_NAME = 'react-template'; /* TODO: Change this to your contract's name! */
-    const DEFAULT_ENV = 'development';
-    ...
-})();
+const CONTRACT_NAME = 'react-template'; /* TODO: Change this to your contract's name! */
+const DEFAULT_ENV = 'development';
+...
 ```
 
 #### Step 3:
-Finally, run the command in your terminal.
-```
-npm install && npm start
+
+Check the scripts in the package.json, for frontend and backend both, run the command:
+
+```bash
+npm run deploy
 ```
+
 with yarn:
-```
-yarn install && yarn start
-```
-The server that starts is for static assets and by default serves them to localhost:5000. Navigate there in your browser to see the app running!
 
-### Deploy
-Check the scripts in the package.json, for frontend and backend both, run the command:
 ```bash
-npm run(yarn) deploy
+yarn deploy
 ```
 
+NOTE: This uses [gh-pages](https://github.com/tschaub/gh-pages) to publish resulting website on GitHub pages. It'll only work if project already has repository set up on GitHub. Feel free to modify `deploy:pages` script in `package.json` to deploy elsewhere.
+
 ### To Explore
 
 - `assembly/main.ts` for the contract code
 - `src/index.html` for the front-end HTML
-- `src/main.js` for the JavaScript front-end code and how to integrate contracts
+- `src/main.js` for the JavaScript front-end code and how to integrate contracts
+- `src/main.test.js` for the JavaScript integration tests of smart contract

blank_project/package.json

@@ -12,7 +12,7 @@
     "prestart": "npm run build:contract && npm run dev:deploy:contract",
     "start": "CONTRACT_NAME=$(cat neardev/dev-account) parcel src/index.html",
     "dev": "nodemon --watch assembly -e ts --exec 'npm run start'",
-    "test": "npm run build:contract && jest test --env=near-shell/test_environment"
+    "test": "npm run build:contract && jest test --env=near-shell/test_environment --runInBand"
   },
   "devDependencies": {
     "gh-pages": "^2.2.0",

blank_project/src/config.js

@@ -1,4 +1,4 @@
-const CONTRACT_NAME = process.env.CONTRACT_NAME ||'nearapp'; /* TODO: fill this in! */
+const CONTRACT_NAME = process.env.CONTRACT_NAME ||'near-blank-project';
 
 function getConfig(env) {
     switch (env) {

blank_react_project/README.md

@@ -9,30 +9,56 @@
 <br />
 
 ## Template for NEAR dapps
-
-### Features
-* Create NEAR dapps with a React frontend 🐲
-* We got Gulp! 💦
-
 ### Requirements
 ##### IMPORTANT: Make sure you have the latest version of NEAR Shell and Node Version > 10.x 
-1. node and npm
-2. near shell
+
+1. [Node.js](https://nodejs.org/en/download/package-manager/)
+2. (optional) near-shell
+
 ```
 npm i -g near-shell
 ```
-3.(optional) install yarn to build
+3. (optional) yarn
 ```
 npm i -g yarn
 ```
+### To run on NEAR testnet
+
+```bash
+npm install && npm dev
+```
+
+with yarn:
+
+```bash
+yarn && yarn dev
+```
+
+The server that starts is for static assets and by default serves them to http://localhost:1234. Navigate there in your browser to see the app running!
+
+NOTE: Both contract and client-side code will auto-reload once you change source files.
+
+### To run tests
+
+```bash
+npm test
+```
+
+with yarn:
+
+```bash
+yarn test
+```
+
+### Deploy
+
+#### Step 1: Create account for the contract
 
-### To run on testnet
-#### Step 1: Create account for the contract and deploy the contract.
 You'll now want to authorize NEAR shell on your NEAR account, which will allow NEAR Shell to deploy contracts on your NEAR account's behalf \(and spend your NEAR account balance to do so\).
 
 Type the command `near login` which should return a url:
 
-```bash
+```
 Please navigate to this url and follow the instructions to log in:
 https://wallet.nearprotocol.com/login/?title=NEAR+Shell&public_key={publicKey}
 ```
@@ -49,41 +75,38 @@ Once you have entered your account ID, it will display the following message:
 This message is not an error, it just means that it will create a public key for you.
 
 #### Step 2:
-Modify src/config.js line that sets the contractName. Set it to id from step 1.
+
+Modify `src/config.js` line that sets the account name of the contract. Set it to the account id from step 1.
+
+NOTE: When you use [create-near-app](https://github.com/nearprotocol/create-near-app) to create the project it'll infer and pre-populate name of contract based on project folder name.
+
 ```javascript
-(function() {
-    const CONTRACT_NAME = 'react-template'; /* TODO: Change this to your contract's name! */
-    const DEFAULT_ENV = 'development';
-    ...
-})();
+const CONTRACT_NAME = 'react-template'; /* TODO: Change this to your contract's name! */
+const DEFAULT_ENV = 'development';
+...
 ```
 
 #### Step 3:
-Finally, run the command in your terminal.
-```
-npm install && npm start
-```
-with yarn:
-```
-yarn install && yarn start
-```
-The server that starts is for static assets and by default serves them to localhost:3000. Navigate there in your browser to see the app running!
 
-### Deploy
 Check the scripts in the package.json, for frontend and backend both, run the command:
+
 ```bash
-npm run(yarn) deploy
+npm run deploy
 ```
 
-### Test
-For test file src/App.test.js, it works for the template after finishing step 3 above. If smart contract and index.js change, user should change to their functions to test. The command is:
+with yarn:
+
 ```bash
-npm run(yarn) test
+yarn deploy
 ```
 
+NOTE: This uses [gh-pages](https://github.com/tschaub/gh-pages) to publish resulting website on GitHub pages. It'll only work if project already has repository set up on GitHub. Feel free to modify `deploy:pages` script in `package.json` to deploy elsewhere.
+
 ### To Explore
 
 - `assembly/main.ts` for the contract code
-- `public/index.html` for the front-end HTML
+- `src/index.html` for the front-end HTML
 - `src/index.js` for the JavaScript front-end code and how to integrate contracts
-- `src/App.js` for the first react component
+- `src/App.js` for the main React component
+- `src/main.test.js` for the JavaScript integration tests of smart contract
+- `src/App.test.js` for the main React component tests

blank_react_project/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "blank_react_template",
+  "name": "near-blank-project",
   "version": "0.1.0",
   "scripts": {
     "build": "npm run build:contract && npm run build:web",
@@ -12,7 +12,7 @@
     "prestart": "npm run build:contract && npm run dev:deploy:contract",
     "start": "CONTRACT_NAME=$(cat neardev/dev-account) parcel src/index.html",
     "dev": "nodemon --watch assembly -e ts --exec 'npm run start'",
-    "test": "npm run build:contract && jest test --env=near-shell/test_environment"
+    "test": "npm run build:contract && jest test --env=near-shell/test_environment --runInBand"
   },
   "devDependencies": {
     "@babel/preset-env": "^7.8.4",
@@ -59,4 +59,4 @@
       "last 1 safari version"
     ]
   }
-}
+}

blank_react_project/src/config.js

@@ -1,4 +1,4 @@
-const CONTRACT_NAME = process.env.CONTRACT_NAME ||'nearapp'; /* TODO: fill this in! */
+const CONTRACT_NAME = process.env.CONTRACT_NAME ||'near-blank-project';
 
 function getConfig(env) {
     switch (env) {