Add extension recommendations, fix linting warnings, improve accessibility (#378)

* chore: add VS Code extension recommendations

* Update image URLs in README and documentation files

* chore: disable no-inline-html rule

* chore: use standard md/mdx syntax, and use .jsx for react components

* chore: fix email links in Code of Conduct

The commit message suggests fixing the email links in the Code of Conduct file to use the correct `mailto:` syntax.

* chore: update actix-web error helper links

Update the links to the `actix-web` error helper traits in the `databases.md` and `errors.md` files to use the correct URLs.

* chore: restore unused actix-web error helper links

* Update src/pages/community/coc.md

Co-authored-by: Rob Ede <robjtede@icloud.com>

* Update docs/getting-started.md

Co-authored-by: Rob Ede <robjtede@icloud.com>

---------

Co-authored-by: Rob Ede <robjtede@icloud.com>

docs/application.md

@@ -2,7 +2,7 @@
 title: Application
 ---
 
-import CodeBlock from "@site/src/components/code_block.js";
+import CodeBlock from "@site/src/components/code_block";
 
 # Writing an Application
 

docs/conn_lifecycle.md

@@ -10,23 +10,23 @@ Once connection accepted Application level protocol processing happens in a prot
 
     Please note, below diagrams are outlining happy-path scenarios only.
 
-![](/img/diagrams/connection_overview.svg)
+![Connection Overview](/img/diagrams/connection_overview.svg)
 
 ## Accept loop in more detail
 
-![](/img/diagrams/connection_accept.svg)
+![Connection Accept](/img/diagrams/connection_accept.svg "Connection Accept")
 
 Most of code implementation resides in [`actix-server`][server] crate for struct [`Accept`][accept].
 
 ## Worker loop in more detail
 
-![](/img/diagrams/connection_worker.svg)
+![Connection Worker](/img/diagrams/connection_worker.svg "Connection Worker")
 
 Most of code implementation resides in [`actix-server`][server] crate for struct [`Worker`][worker].
 
 ## Request loop roughly
 
-![](/img/diagrams/connection_request.svg)
+![Connection Request](/img/diagrams/connection_request.svg "Connection Request")
 
 Most of code implementation for request loop resides in [`actix-web`][web] and [`actix-http`][http] crates.
 

docs/databases.md

@@ -2,15 +2,15 @@
 title: Databases
 ---
 
-import CodeBlock from "@site/src/components/code_block.js";
+import CodeBlock from "@site/src/components/code_block";
 
 # Async Options
 
 We have several example projects showing use of async database adapters:
 
-- Postgres: https://github.com/actix/examples/tree/master/databases/postgres
-- SQLite: https://github.com/actix/examples/tree/master/databases/sqlite
-- MongoDB: https://github.com/actix/examples/tree/master/databases/mongodb
+- [Postgres](https://github.com/actix/examples/tree/master/databases/postgres)
+- [SQLite](https://github.com/actix/examples/tree/master/databases/sqlite)
+- [MongoDB](https://github.com/actix/examples/tree/master/databases/mongodb)
 
 # Diesel
 
@@ -30,7 +30,7 @@ This example also maps the error to an `HttpResponse` before using the `?` opera
 
 <CodeBlock example="databases" file="main.rs" section="index" />
 
-That's it! See the full example here: https://github.com/actix/examples/tree/master/databases/diesel
+That's it! See the full example [here](https://github.com/actix/examples/tree/master/databases/diesel).
 
 [web-block]: https://docs.rs/actix-web/4/actix_web/web/fn.block.html
-[response-error]: https://docs.rs/actix-web/4/actix_web/trait.ResponseError.html
+[response-error]: https://docs.rs/actix-web/4/actix_web/error/trait.ResponseError.html

docs/errors.md

@@ -2,7 +2,7 @@
 title: Errors
 ---
 
-import CodeBlock from "@site/src/components/code_block.js";
+import CodeBlock from "@site/src/components/code_block";
 
 # Errors
 
@@ -62,7 +62,7 @@ See the [API documentation for actix-web's `error` module][actixerror] for a ful
 
 Actix logs all errors at the `WARN` log level. If an application's log level is set to `DEBUG` and `RUST_BACKTRACE` is enabled, the backtrace is also logged. These are configurable with environmental variables:
 
-```
+```sh
 >> RUST_BACKTRACE=1 RUST_LOG=actix_web=debug cargo run
 ```
 
@@ -99,7 +99,7 @@ log = "0.4"
 <CodeBlock example="errors" file="logging.rs" section="logging" />
 
 [actixerror]: https://docs.rs/actix-web/4/actix_web/error/struct.Error.html
-[errorhelpers]: https://docs.rs/actix-web/4/actix_web/trait.ResponseError.html
+[errorhelpers]: https://docs.rs/actix-web/4/actix_web/error/trait.ResponseError.html
 [derive_more]: https://crates.io/crates/derive_more
 [responseerror]: https://docs.rs/actix-web/4/actix_web/error/trait.ResponseError.html
 [responseerrorimpls]: https://docs.rs/actix-web/4/actix_web/error/trait.ResponseError.html#foreign-impls

docs/extractors.md

@@ -2,7 +2,7 @@
 title: Extractors
 ---
 
-import CodeBlock from "@site/src/components/code_block.js";
+import CodeBlock from "@site/src/components/code_block";
 
 # Type-safe information extraction
 

docs/getting-started.md

@@ -2,7 +2,7 @@
 title: Getting Started
 ---
 
-import RenderCodeBlock from '@theme/CodeBlock'; import CodeBlock from "@site/src/components/code_block.js"; import { rustVersion, actixWebMajorVersion } from "@site/vars";
+import RenderCodeBlock from '@theme/CodeBlock'; import CodeBlock from "@site/src/components/code_block"; import { rustVersion, actixWebMajorVersion } from "@site/vars";
 
 ## Installing Rust
 

docs/handlers.md

@@ -2,7 +2,7 @@
 title: Handlers
 ---
 
-import CodeBlock from "@site/src/components/code_block.js";
+import CodeBlock from "@site/src/components/code_block";
 
 # Request Handlers
 

docs/http2.md

@@ -2,7 +2,7 @@
 title: HTTP/2
 ---
 
-import RenderCodeBlock from '@theme/CodeBlock'; import CodeBlock from '@site/src/components/code_block.js'; import { actixWebMajorVersion } from "@site/vars";
+import RenderCodeBlock from '@theme/CodeBlock'; import CodeBlock from '@site/src/components/code_block'; import { actixWebMajorVersion } from "@site/vars";
 
 `actix-web` automatically upgrades connections to _HTTP/2_ if possible.
 

docs/http_server_init.md

@@ -19,4 +19,4 @@ async fn main() -> std::io::Result<()> {
 }
 ```
 
-![](/img/diagrams/http_server.svg)
+![HTTP Server Diagram](/img/diagrams/http_server.svg)

docs/middleware.md

@@ -2,7 +2,7 @@
 title: Middleware
 ---
 
-import CodeBlock from "@site/src/components/code_block.js";
+import CodeBlock from "@site/src/components/code_block";
 
 # Middleware
 
@@ -49,7 +49,7 @@ Create `Logger` middleware with the specified `format`. Default `Logger` can be
 
 The following is an example of the default logging format:
 
-```
+```log
 INFO:actix_web::middleware::logger: 127.0.0.1:59934 [02/Dec/2017:00:21:43 -0800] "GET / HTTP/1.1" 302 0 "-" "curl/7.54.0" 0.000397
 INFO:actix_web::middleware::logger: 127.0.0.1:59947 [02/Dec/2017:00:22:40 -0800] "GET /index.html HTTP/1.1" 200 0 "-" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10.13; rv:57.0) Gecko/20100101 Firefox/57.0" 0.000646
 ```

docs/request.md

@@ -2,7 +2,7 @@
 title: Requests
 ---
 
-import CodeBlock from "@site/src/components/code_block.js";
+import CodeBlock from "@site/src/components/code_block";
 
 # JSON Request
 

docs/response.md

@@ -2,7 +2,7 @@
 title: Responses
 ---
 
-import CodeBlock from "@site/src/components/code_block.js";
+import CodeBlock from "@site/src/components/code_block";
 
 # Response
 

docs/server.md

@@ -2,7 +2,7 @@
 title: Server
 ---
 
-import RenderCodeBlock from '@theme/CodeBlock'; import CodeBlock from '@site/src/components/code_block.js'; import { actixWebMajorVersion } from "@site/vars";
+import RenderCodeBlock from '@theme/CodeBlock'; import CodeBlock from '@site/src/components/code_block'; import { actixWebMajorVersion } from "@site/vars";
 
 # The HTTP Server
 
@@ -70,8 +70,7 @@ openssl = { version = "0.10" }
 To create the key.pem and cert.pem use the command. **Fill in your own subject**
 
 ```bash
-$ openssl req -x509 -newkey rsa:4096 -keyout key.pem -out cert.pem \
-  -days 365 -sha256 -subj "/C=CN/ST=Fujian/L=Xiamen/O=TVlinux/OU=Org/CN=muro.lxd"
+$ openssl req -x509 -newkey rsa:4096 -keyout key.pem -out cert.pem -days 365 -sha256 -subj "/C=CN/ST=Fujian/L=Xiamen/O=TVlinux/OU=Org/CN=muro.lxd"
 ```
 
 To remove the password, then copy nopass.pem to key.pem

docs/shuttle.md

@@ -2,11 +2,11 @@
 title: Hosting on Shuttle
 ---
 
-import CodeBlock from '@site/src/components/code_block.js';
+import CodeBlock from '@site/src/components/code_block';
 
 # Hosting on Shuttle
 
-<img width="300" src="https://raw.githubusercontent.com/shuttle-hq/shuttle/master/assets/logo-rectangle-transparent.png"/>
+<img width="300" src="https://raw.githubusercontent.com/shuttle-hq/shuttle/master/assets/logo-rectangle-transparent.png" alt="Shuttle Logo"/>
 
 > [**Shuttle**](https://www.shuttle.rs) is a Rust-native cloud development platform that lets you deploy your Rust apps for free.
 

docs/static-files.md

@@ -2,7 +2,7 @@
 title: Static Files
 ---
 
-import CodeBlock from "@site/src/components/code_block.js";
+import CodeBlock from "@site/src/components/code_block";
 
 # Individual file
 

docs/testing.md

@@ -2,7 +2,7 @@
 title: Testing
 ---
 
-import CodeBlock from "@site/src/components/code_block.js";
+import CodeBlock from "@site/src/components/code_block";
 
 # Testing
 

docs/url-dispatch.md

@@ -2,7 +2,7 @@
 title: URL Dispatch
 ---
 
-import CodeBlock from "@site/src/components/code_block.js";
+import CodeBlock from "@site/src/components/code_block";
 
 # URL Dispatch
 
@@ -12,7 +12,7 @@ URL dispatch provides a simple way for mapping URLs to handler code using a simp
 
 ## Resource configuration
 
-Resource configuration is the act of adding a new resources to an application. A resource has a name, which acts as an identifier to be used for URL generation. The name also allows developers to add routes to existing resources. A resource also has a pattern, meant to match against the _PATH_ portion of a _URL_ (the portion following the scheme and port, e.g. _/foo/bar_ in the _URL_ _http://localhost:8080/foo/bar?q=value_). It does not match against the _QUERY_ portion (the portion that follows _?_, e.g. _q=value_ in _http://localhost:8080/foo/bar?q=value_).
+Resource configuration is the act of adding a new resources to an application. A resource has a name, which acts as an identifier to be used for URL generation. The name also allows developers to add routes to existing resources. A resource also has a pattern, meant to match against the _PATH_ portion of a _URL_ (the portion following the scheme and port, e.g. _/foo/bar_ in the _URL_ _`http://localhost:8080/foo/bar?q=value`_). It does not match against the _QUERY_ portion (the portion that follows _?_, e.g. _q=value_ in _`http://localhost:8080/foo/bar?q=value`_).
 
 The [_App::route()_][approute] method provides simple way of registering routes. This method adds a single route to application routing table. This method accepts a _path pattern_, _HTTP method_ and a handler function. `route()` method could be called multiple times for the same path, in that case, multiple routes register for the same resource path.
 
@@ -206,7 +206,7 @@ Use the [_HttpRequest.url_for()_][urlfor] method to generate URLs based on resou
 
 <CodeBlock example="url-dispatch" file="urls.rs" section="url" />
 
-This would return something like the string `http://example.com/test/1/2/3` (at least if the current protocol and hostname implied http://example.com). `url_for()` method returns [_Url object_][urlobj] so you can modify this url (add query parameters, anchor, etc). `url_for()` could be called only for _named_ resources otherwise error get returned.
+This would return something like the string `http://example.com/test/1/2/3` (at least if the current protocol and hostname implied `http://example.com`). `url_for()` method returns [_Url object_][urlobj] so you can modify this url (add query parameters, anchor, etc). `url_for()` could be called only for _named_ resources otherwise error get returned.
 
 ## External resources
 

docs/websockets.md

@@ -2,7 +2,7 @@
 title: Websockets
 ---
 
-import CodeBlock from "@site/src/components/code_block.js";
+import CodeBlock from "@site/src/components/code_block";
 
 # Websockets