fixed typos and grammar, as well as spacing in code block (#14778)

docs/designers-developers/developers/tutorials/javascript/extending-the-block-editor.md

@@ -34,21 +34,20 @@ See [Packages](/docs/designers-developers/developers/packages.md) for list of av
 
 After you have updated both JavaScript and PHP files, go to the block editor and create a new post.
 
-Add a quote block, and in the right sidebar under Styles, you will see your new Fancy Quote style listed.  Click the Fancy Quote to select and apply that style to your quote block.
+Add a quote block, and in the right sidebar under Styles, you will see your new Fancy Quote style listed.  Click the Fancy Quote to select and apply that style to your quote block:
 
 
 ![Fancy Quote Style in Inspector](https://raw.githubusercontent.com/WordPress/gutenberg/master/docs/designers-developers/assets/fancy-quote-in-inspector.png)
 
 
-You will not see a visible change, even if you Preview or Publish the post. However, if you look at the source, you will see the `is-style-fancy-quote` class name is now attached to your quote block.
+Even if you Preview or Publish the post you will not see a visible change. However, if you look at the source, you will see the `is-style-fancy-quote` class name is now attached to your quote block.
 
 Let's add some style. Go ahead and create a `style.css` file with:
 
 ```css
 .is-style-fancy-quote {
 	color: tomato;
 }
-
 ```
 
 You enqueue the CSS file by adding the following to your `myguten-plugin.php`:
@@ -60,7 +59,7 @@ function myguten_stylesheet() {
 add_action( 'enqueue_block_assets', 'myguten_stylesheet' );
 ```
 
-Now when you view in the editor and published, you will see your Fancy Quote style, a delicious tomato color text.
+Now when you view in the editor and published, you will see your Fancy Quote style, a delicious tomato color text:
 
 ![Fancy Quote with Style](https://raw.githubusercontent.com/WordPress/gutenberg/master/docs/designers-developers/assets/fancy-quote-with-style.png)
 

docs/designers-developers/developers/tutorials/javascript/js-build-setup.md

@@ -36,7 +36,7 @@ Additionally, the [Node.js download page](https://nodejs.org/en/download/) inclu
 
 The Node Package Manager (npm) is a tool included with node. npm allows you to install and manage JavaScript packages. npm can also generate and process a special file called `package.json`, which contains some information about your project and the packages your project uses.
 
-To start a new node project, first create a directory to work in.
+To start a new node project, first create a directory to work in:
 
 ```
 mkdir myguten-block
@@ -153,7 +153,7 @@ Yes, the initial setup is a bit more involved, but the additional features and b
 
 With a setup in place, the standard workflow is:
 
-- Install dependencies: `npm install`
-- Start development builds: `npm start`
-- Develop. Test. Repeat.
-- Create production build: `npm run build`
+1. Install dependencies: `npm install`
+2. Start development builds: `npm start`
+3. Develop. Test. Repeat.
+4. Create production build: `npm run build`

docs/designers-developers/developers/tutorials/javascript/troubleshooting.md

@@ -6,7 +6,7 @@ If you're having trouble getting your code to work, here are a few ways to troub
 
 The console log is a JavaScript developer's best friend. It is a good practice to work with it open, as it collects errors and notices into one place. See Mozilla's [JavaScript console](https://developer.mozilla.org/en-US/docs/Learn/Common_questions/What_are_browser_developer_tools#The_JavaScript_console) documentation for more.
 
-Your first step in debugging should be to check the JavaScript console for any errors. Here is an example, which shows a syntax error on line 6.
+Your first step in debugging should be to check the JavaScript console for any errors. Here is an example, which shows a syntax error on line 6:
 
 ![console error](https://raw.githubusercontent.com/WordPress/gutenberg/master/docs/designers-developers/assets/js-tutorial-console-log-error.png)