From 85b4eedcd60072683f9454ec1b294ce0ef8cf022 Mon Sep 17 00:00:00 2001 From: Salvatore Tosti Date: Mon, 17 Apr 2017 19:38:20 -0700 Subject: [PATCH] Changed wording in build.md and debug.md I've adjusted the wording in the build and debug files to flow better and make more sense in English. --- docs/build.md | 28 ++++++++++++++-------------- docs/debug.md | 12 ++++++------ 2 files changed, 20 insertions(+), 20 deletions(-) diff --git a/docs/build.md b/docs/build.md index a081038b6..10eef6acf 100644 --- a/docs/build.md +++ b/docs/build.md @@ -3,44 +3,44 @@ ## Development We use Webpack HMR to develop Boostnote. -You can use following commands to use default configuration at the top of project directory. +Running the following commands, at the top of the project directory, will start Boostnote with the default configurations. -Install requirement packages. +Install the required packages using yarn. ``` $ yarn ``` -Build codes and run. +Build and run. ``` $ yarn run dev-start ``` -This command runs `yarn run webpack` and `yarn run hot` in parallel. It means it is the same thing to run those commands in 2 terminals. +This command runs `yarn run webpack` and `yarn run hot` in parallel. It is the same as running these commands in two terminals. -And webpack will watch the code changes and apply it automatically. +The `webpack` will watch for code changes and then apply them automatically. -If this error: `Failed to load resource: net::ERR_CONNECTION_REFUSED` happens, please reload Boostnote. +If the following error occurs: `Failed to load resource: net::ERR_CONNECTION_REFUSED`, please reload Boostnote. ![net::ERR_CONNECTION_REFUSED](https://cloud.githubusercontent.com/assets/11307908/24343004/081e66ae-1279-11e7-8d9e-7f478043d835.png) > ### Notice -> There are some cases you have to refresh app yourself. -> 1. When editing constructor method of a component -> 2. When adding a new css class(same to 1: CSS class is re-written by each component. This process occurs at Constructor method.) +> There are some cases where you have to refresh the app manually. +> 1. When editing a constructor method of a component +> 2. When adding a new css class (similar to 1: the CSS class is re-written by each component. This process occurs at the Constructor method.) ## Deploy -We use Grunt. -Acutal deploy can be run by `grunt`. However, you shouldn't use because the default task is including codesign and authenticode. +We use Grunt to automate deployment. +You can build the program by using `grunt`. However, we don't recommend this because the default task includes codesign and authenticode. -So, we prepare a script which just make an executable file. +So, we've prepared a separate script which just makes an executable file. ``` grunt pre-build ``` -You will find the executable from `dist`. In this case, auto updater won't work because the app isn't signed. +You will find the executable in the `dist` directory. Note, the auto updater won't work because the app isn't signed. -If you are necessary, you can do codesign or authenticode by this excutable. +If you find it necessary, you can use codesign or authenticode with this executable. diff --git a/docs/debug.md b/docs/debug.md index e1a4504eb..ce1e12263 100644 --- a/docs/debug.md +++ b/docs/debug.md @@ -1,20 +1,20 @@ -# How to debug Boostnote (electron app) -The electron that makes Boostnote is made from Chromium, developers can use `Developer Tools` as same as Google Chrome. +# How to debug Boostnote (Electron app) +Boostnote is an Electron app so it's based on Chromium; developers can use `Developer Tools` just like Google Chrome. -This is how to toggle Developer Tools: +You can toggle the `Developer Tools` like this: ![how_to_toggle_devTools](https://cloud.githubusercontent.com/assets/11307908/24343585/162187e2-127c-11e7-9c01-23578db03ecf.png) -The Developer Tools is like this: +The `Developer Tools` will look like this: ![Developer_Tools](https://cloud.githubusercontent.com/assets/11307908/24343545/eff9f3a6-127b-11e7-94cf-cb67bfda634a.png) When errors occur, the error messages are displayed at the `console`. ## Debugging -For example, there is a way to put `debugger` as a breakpoint into the code like this: +For example, you can use the `debugger` to set a breakpoint in the code like this: ![debugger](https://cloud.githubusercontent.com/assets/11307908/24343879/9459efea-127d-11e7-9943-f60bf7f66d4a.png) -But this is only an example. You need to find a way to debug which fits with you. +This is just an illustrative example, you should find a way to debug which fits your style. ## References * [Official document of Google Chrome about debugging](https://developer.chrome.com/devtools)