gaspersic/freeCodeCamp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

feat: update backend project links (#39314)

Browse Source 
* feat: update backend project links

Replace solution and remix Glitch links with equivalent Repl.it links in backend projects/challenges and intro pages.

* fix: link and Repl.it casing

* fix: update mention of glitch in testing challenge

* Apply suggestions from code review

Co-authored-by: Oliver Eyton-Williams <ojeytonwilliams@gmail.com>

Co-authored-by: Mrugesh Mohapatra <1884376+raisedadead@users.noreply.github.com>
Co-authored-by: Oliver Eyton-Williams <ojeytonwilliams@gmail.com>
This commit is contained in:
Kristofer Koishigawa
2020-08-18 06:38:16 +09:00
committed by GitHub
parent 9a4976bd57
commit 6b3c61c737
95 changed files with 141 additions and 138 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
client/src/pages/learn/apis-and-microservices/basic-node-and-express/index.md
View File

@ -14,6 +14,6 @@ Node.js is a JavaScript runtime that allows developers to write backend (server-
Express, while not included with Node.js, is another module often used with it. Express runs between the server created by Node.js and the frontend pages of a web application. Express also handles an application's routing. Routing directs users to the correct page based on their interaction with the application. While there are alternatives to using Express, its simplicity makes it a good place to begin when learning the interaction between a backend powered by Node.js and the frontend. Express, while not included with Node.js, is another module often used with it. Express runs between the server created by Node.js and the frontend pages of a web application. Express also handles an application's routing. Routing directs users to the correct page based on their interaction with the application. While there are alternatives to using Express, its simplicity makes it a good place to begin when learning the interaction between a backend powered by Node.js and the frontend.
Working on these challenges will involve you writing your code on Glitch on our starter project. After completing each challenge you can copy your public Glitch url (to the homepage of your app) into the challenge screen to test it! Optionally you may choose to write your project on another platform but it must be publicly visible for our testing. Working on these challenges will involve you writing your code on Repl.it on our starter project. After completing each challenge you can copy your public Repl.it URL (to the homepage of your app) into the challenge screen to test it! Optionally you may choose to write your project on another platform but it must be publicly visible for our testing.
Start this project on Glitch using **<a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-express/'>this link</a>** or clone <a href='https://github.com/freeCodeCamp/boilerplate-express/'>this repository</a> on GitHub! If you use Glitch, remember to save the link to your project somewhere safe! Start this project on Repl.it using <a href='https://repl.it/github/freeCodeCamp/boilerplate-express'>this link</a> or clone <a href='https://github.com/freeCodeCamp/boilerplate-express/'>this repository</a> on GitHub! If you use Repl.it, remember to save the link to your project somewhere safe!

4
client/src/pages/learn/apis-and-microservices/managing-packages-with-npm/index.md
View File

@ -14,6 +14,6 @@ npm saves packages in a folder named <code>node\_modules</code>. These packages
2. locally within a project's own <code>node\_modules</code> folder, accessible only to that project. 2. locally within a project's own <code>node\_modules</code> folder, accessible only to that project.
Most developers prefer to install packages local to each project to create a separation between the dependencies of different projects. Most developers prefer to install packages local to each project to create a separation between the dependencies of different projects.
Working on these challenges will involve you writing your code on Glitch on our starter project. After completing each challenge you can copy your public Glitch url (to the homepage of your app) into the challenge screen to test it! Optionally you may choose to write your project on another platform but it must be publicly visible for our testing. Working on these challenges will involve you writing your code on Repl.it on our starter project. After completing each challenge you can copy your public Repl.it URL (to the homepage of your app) into the challenge screen to test it! Optionally you may choose to write your project on another platform but it must be publicly visible for our testing.
Start this project on Glitch using <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-npm/'>this link</a> or clone <a href='https://github.com/freeCodeCamp/boilerplate-npm/'>this repository</a> on GitHub! If you use Glitch, remember to save the link to your project somewhere safe! Start this project on Repl.it using <a href='https://repl.it/github/freeCodeCamp/boilerplate-npm'>this link</a> or clone <a href='https://github.com/freeCodeCamp/boilerplate-npm/'>this repository</a> on GitHub! If you use Repl.it, remember to save the link to your project somewhere safe!

4
client/src/pages/learn/apis-and-microservices/mongodb-and-mongoose/index.md
View File

@ -16,9 +16,9 @@ While there are many non-relational databases, Mongo's use of JSON as its docume
Mongoose.js is an npm module for Node.js that allows you to write objects for Mongo as you would in JavaScript. This can make it easier to construct documents for storage in Mongo. Mongoose.js is an npm module for Node.js that allows you to write objects for Mongo as you would in JavaScript. This can make it easier to construct documents for storage in Mongo.
Working on these challenges will involve you writing your code on Glitch on our starter project. After completing each challenge you can copy your public glitch url (to the homepage of your app) into the challenge screen to test it! Optionally you may choose to write your project on another platform but it must be publicly visible for our testing. Working on these challenges will involve you writing your code on Repl.it on our starter project. After completing each challenge you can copy your public Repl.it URL (to the homepage of your app) into the challenge screen to test it! Optionally you may choose to write your project on another platform but it must be publicly visible for our testing.
Start this project on Glitch using [this link](https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-mongomongoose/) or clone [this repository](https://github.com/freeCodeCamp/boilerplate-mongomongoose/) on GitHub! If you use Glitch, remember to save the link to your project somewhere safe! Start this project on Repl.it using [this link](https://repl.it/github/freeCodeCamp/boilerplate-mongomongoose) or clone [this repository](https://github.com/freeCodeCamp/boilerplate-mongomongoose/) on GitHub! If you use Repl.it, remember to save the link to your project somewhere safe!
## Use MongoDB Atlas to host a free mongodb instance for your projects ## Use MongoDB Atlas to host a free mongodb instance for your projects

4
client/src/pages/learn/information-security/information-security-with-helmetjs/index.md
View File

@ -7,6 +7,6 @@ superBlock: Information Security
HelmetJS is a type of middleware for Express-based applications that automatically sets HTTP headers to prevent sensitive information from unintentionally being passed between the server and client. While HelmetJS does not account for all situations, it does include support for common ones like Content Security Policy, XSS Filtering, and HTTP Strict Transport Security, among others. HelmetJS can be installed on an Express project from npm, after which each layer of protection can be configured to best fit the project. HelmetJS is a type of middleware for Express-based applications that automatically sets HTTP headers to prevent sensitive information from unintentionally being passed between the server and client. While HelmetJS does not account for all situations, it does include support for common ones like Content Security Policy, XSS Filtering, and HTTP Strict Transport Security, among others. HelmetJS can be installed on an Express project from npm, after which each layer of protection can be configured to best fit the project.
Working on these challenges will involve you writing your code on Glitch on our starter project. After completing each challenge, you can copy your public Glitch url (to the homepage of your app) into the challenge screen to test it! Optionally, you may choose to write your project on another platform, but it must be publicly visible for our testing. Working on these challenges will involve you writing your code on Repl.it on our starter project. After completing each challenge, you can copy your public Repl.it URL (to the homepage of your app) into the challenge screen to test it! Optionally, you may choose to write your project on another platform, but it must be publicly visible for our testing.
Start this project on Glitch using <a rel='noopener noreferrer' target='_blank' href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-infosec/'>this link</a> or clone <a rel='noopener noreferrer' target='_blank' href='https://github.com/freeCodeCamp/boilerplate-infosec/'>this repository</a> on GitHub! If you use Glitch, remember to save the link to your project somewhere safe! Start this project on Repl.it using <a rel='noopener noreferrer' target='_blank' href='https://repl.it/github/freeCodeCamp/boilerplate-infosec'>this link</a> or clone <a rel='noopener noreferrer' target='_blank' href='https://github.com/freeCodeCamp/boilerplate-infosec/'>this repository</a> on GitHub! If you use Repl.it, remember to save the link to your project somewhere safe!

4
client/src/pages/learn/quality-assurance/advanced-node-and-express/index.md
View File

@ -7,6 +7,6 @@ superBlock: Quality Assurance
*Authentication* is the process or action of verifying the identity of a user or process. Up to this point you have not been able to create an app utilizing this key concept. *Authentication* is the process or action of verifying the identity of a user or process. Up to this point you have not been able to create an app utilizing this key concept.
The most common and easiest way to use authentication middleware for Node.js is [Passport](http://passportjs.org/). It is easy to learn, light-weight, and extremely flexible allowing for many *strategies*, which we will talk about in later challenges. In addition to authentication we will also look at template engines which allow for use of *Pug* and web sockets which allow for real time communication between all your clients and your server. Working on these challenges will involve you writing your code on Glitch on our starter project. After completing each challenge you can copy your public glitch url (to the homepage of your app) into the challenge screen to test it! Optionally you may choose to write your project on another platform but it must be publicly visible for our testing. The most common and easiest way to use authentication middleware for Node.js is [Passport](http://passportjs.org/). It is easy to learn, light-weight, and extremely flexible allowing for many *strategies*, which we will talk about in later challenges. In addition to authentication we will also look at template engines which allow for use of *Pug* and web sockets which allow for real time communication between all your clients and your server. Working on these challenges will involve you writing your code on Repl.it on our starter project. After completing each challenge you can copy your public Repl.it URL (to the homepage of your app) into the challenge screen to test it! Optionally you may choose to write your project on another platform but it must be publicly visible for our testing.
Start this project on Glitch using [this link](https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-advancednode/) or clone [this repository](https://github.com/freeCodeCamp/boilerplate-advancednode/) on GitHub! If you use Glitch, remember to save the link to your project somewhere safe. Start this project on Repl.it using [this link](https://repl.it/github/freeCodeCamp/boilerplate-advancednode) or clone [this repository](https://github.com/freeCodeCamp/boilerplate-advancednode/) on GitHub! If you use Repl.it, remember to save the link to your project somewhere safe.

4
client/src/pages/learn/quality-assurance/quality-assurance-and-testing-with-chai/index.md
View File

@ -7,6 +7,6 @@ superBlock: Quality Assurance
As your programs become more complex, you need to test them often to make sure any new code you add doesn't break the program's original functionality. Chai is a JavaScript testing library that helps you check that your program still behaves the way you expect it to after you make changes. Using Chai, you can write tests that describe your program's requirements and see if your program meets them. As your programs become more complex, you need to test them often to make sure any new code you add doesn't break the program's original functionality. Chai is a JavaScript testing library that helps you check that your program still behaves the way you expect it to after you make changes. Using Chai, you can write tests that describe your program's requirements and see if your program meets them.
Working on these challenges will involve you writing your code on Glitch on our starter project. After completing each challenge you can copy your public glitch url (to the homepage of your app) into the challenge screen to test it! Optionally you may choose to write your project on another platform but it must be publicly visible for our testing. Working on these challenges will involve you writing your code on Repl.it on our starter project. After completing each challenge you can copy your public Repl.it URL (to the homepage of your app) into the challenge screen to test it! Optionally you may choose to write your project on another platform but it must be publicly visible for our testing.
Start this project on Glitch using [this link](https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-mochachai/) or clone [this repository](https://github.com/freeCodeCamp/boilerplate-mochachai/) on GitHub! If you use Glitch, remember to save the link to your project somewhere safe! Start this project on Repl.it using [this link](https://repl.it/github/freeCodeCamp/boilerplate-mochachai) or clone [this repository](https://github.com/freeCodeCamp/boilerplate-mochachai/) on GitHub! If you use Repl.it, remember to save the link to your project somewhere safe!

2
client/src/templates/Challenges/projects/SolutionForm.js
View File

@ -58,7 +58,7 @@ export class SolutionForm extends Component {
case backEndProject: case backEndProject:
solutionFormFields = backEndProjectFields; solutionFormFields = backEndProjectFields;
solutionLink = solutionLink + 'https://camperbot.glitch.me'; solutionLink = solutionLink + 'https://project-name.camperbot.repl.co/';
solutionFormID = 'back-end-form'; solutionFormID = 'back-end-form';
break; break;

10
curriculum/challenges/english/05-apis-and-microservices/apis-and-microservices-projects/exercise-tracker.english.md
View File

@ -9,9 +9,9 @@ forumTopicId: 301505
## Description ## Description
<section id='description'> <section id='description'>
Build a full stack JavaScript app that is functionally similar to this: <a href='https://nonstop-pond.glitch.me/' target='_blank'>https://nonstop-pond.glitch.me/</a>. Build a full stack JavaScript app that is functionally similar to this: <a href='https://exercise-tracker.freecodecamp.repl.co/' target='_blank'>https://exercise-tracker.freecodecamp.repl.co/</a>.
Working on this project will involve you writing your code on Glitch on our starter project. After completing this project you can copy your public glitch url (to the homepage of your app) into this screen to test it! Optionally you may choose to write your project on another platform but it must be publicly visible for our testing. Working on this project will involve you writing your code on Repl.it on our starter project. After completing this project you can copy your public Repl.it url (to the homepage of your app) into this screen to test it! Optionally you may choose to write your project on another platform but it must be publicly visible for our testing.
Start this project on Glitch using <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-project-exercisetracker/' target='_blank'>this link</a> or clone <a href='https://github.com/freeCodeCamp/boilerplate-project-exercisetracker/'>this repository</a> on GitHub! If you use Glitch, remember to save the link to your project somewhere safe! Start this project on Repl.it using <a href='https://repl.it/github/freeCodeCamp/boilerplate-project-exercisetracker' target='_blank'>this link</a> or clone <a href='https://github.com/freeCodeCamp/boilerplate-project-exercisetracker/'>this repository</a> on GitHub! If you use Repl.it, remember to save the link to your project somewhere safe!
</section> </section>
## Instructions ## Instructions
@ -24,10 +24,10 @@ Start this project on Glitch using <a href='https://glitch.com/edit/#!/remix/clo
```yml ```yml
tests: tests:
- text: I can provide my own project, not the example url. - text: I can provide my own project, not the example URL.
testString: "getUserInput => { testString: "getUserInput => {
const url = getUserInput('url'); const url = getUserInput('url');
assert(!(new RegExp('.*/nonstop-pond\\.glitch\\.me\\.*')).test(getUserInput('url'))); assert(!(new RegExp('.*/exercise-tracker\\.freecodecamp\\.repl\\.co')).test(getUserInput('url')));
} }
" "

6
curriculum/challenges/english/05-apis-and-microservices/apis-and-microservices-projects/file-metadata-microservice.english.md
View File

@ -9,9 +9,9 @@ forumTopicId: 301506
## Description ## Description
<section id='description'> <section id='description'>
Build a full stack JavaScript app that is functionally similar to this: <a href='https://purple-paladin.glitch.me/' target='_blank'>https://purple-paladin.glitch.me/</a>. Build a full stack JavaScript app that is functionally similar to this: <a href='https://file-metadata.freecodecamp.repl.co/' target='_blank'>https://file-metadata.freecodecamp.repl.co/</a>.
Working on this project will involve you writing your code on Glitch on our starter project. After completing this project you can copy your public glitch url (to the homepage of your app) into this screen to test it! Optionally you may choose to write your project on another platform but it must be publicly visible for our testing. Working on this project will involve you writing your code on Repl.it on our starter project. After completing this project you can copy your public Repl.it URL (to the homepage of your app) into this screen to test it! Optionally you may choose to write your project on another platform but it must be publicly visible for our testing.
Start this project on Glitch using <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-project-filemetadata/' target='_blank'>this link</a> or clone <a href='https://github.com/freeCodeCamp/boilerplate-project-filemetadata/'>this repository</a> on GitHub! If you use Glitch, remember to save the link to your project somewhere safe! Start this project on Repl.it using <a href='https://repl.it/github/freeCodeCamp/boilerplate-project-filemetadata' target='_blank'>this link</a> or clone <a href='https://github.com/freeCodeCamp/boilerplate-project-filemetadata/'>this repository</a> on GitHub! If you use Repl.it, remember to save the link to your project somewhere safe!
</section> </section>
## Instructions ## Instructions

6
curriculum/challenges/english/05-apis-and-microservices/apis-and-microservices-projects/request-header-parser-microservice.english.md
View File

@ -9,9 +9,9 @@ forumTopicId: 301507
## Description ## Description
<section id='description'> <section id='description'>
Build a full stack JavaScript app that is functionally similar to this: <a href='https://dandelion-roar.glitch.me/' target='_blank'>https://dandelion-roar.glitch.me/</a>. Build a full stack JavaScript app that is functionally similar to this: <a href='https://head-parser--freecodecamp.repl.co/' target='_blank'>https://head-parser--freecodecamp.repl.co/</a>.
Working on this project will involve you writing your code on Glitch on our starter project. After completing this project you can copy your public glitch url (to the homepage of your app) into this screen to test it! Optionally you may choose to write your project on another platform but it must be publicly visible for our testing. Working on this project will involve you writing your code on Repl.it on our starter project. After completing this project you can copy your public Repl.it URL (to the homepage of your app) into this screen to test it! Optionally you may choose to write your project on another platform but it must be publicly visible for our testing.
Start this project on Glitch using <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-project-headerparser/' target='_blank'>this link</a> or clone <a href='https://github.com/freeCodeCamp/boilerplate-project-headerparser/'>this repository</a> on GitHub! If you use Glitch, remember to save the link to your project somewhere safe! Start this project on Repl.it using <a href='https://repl.it/github/freeCodeCamp/boilerplate-project-headerparser' target='_blank'>this link</a> or clone <a href='https://github.com/freeCodeCamp/boilerplate-project-headerparser/'>this repository</a> on GitHub! If you use Repl.it, remember to save the link to your project somewhere safe!
</section> </section>
## Instructions ## Instructions

6
curriculum/challenges/english/05-apis-and-microservices/apis-and-microservices-projects/timestamp-microservice.english.md
View File

@ -9,9 +9,9 @@ forumTopicId: 301508
## Description ## Description
<section id='description'> <section id='description'>
Build a full stack JavaScript app that is functionally similar to this: <a href='https://curse-arrow.glitch.me/' target='_blank'>https://curse-arrow.glitch.me/</a>. Build a full stack JavaScript app that is functionally similar to this: <a href='https://timestamp-microservice.freecodecamp.repl.co/' target='_blank'>https://timestamp-microservice.freecodecamp.repl.co/</a>.
Working on this project will involve you writing your code on Glitch on our starter project. After completing this project you can copy your public glitch url (to the homepage of your app) into this screen to test it! Optionally you may choose to write your project on another platform but it must be publicly visible for our testing. Working on this project will involve you writing your code on Repl.it on our starter project. After completing this project you can copy your public Repl.it URL (to the homepage of your app) into this screen to test it! Optionally you may choose to write your project on another platform but it must be publicly visible for our testing.
Start this project on Glitch using <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-project-timestamp/' target='_blank'>this link</a> or clone <a href='https://github.com/freeCodeCamp/boilerplate-project-timestamp/'>this repository</a> on GitHub! If you use Glitch, remember to save the link to your project somewhere safe! Start this project on Repl.it using <a href='https://repl.it/github/freeCodeCamp/boilerplate-project-timestamp' target='_blank'>this link</a> or clone <a href='https://github.com/freeCodeCamp/boilerplate-project-timestamp/'>this repository</a> on GitHub! If you use Repl.it, remember to save the link to your project somewhere safe!
</section> </section>
## Instructions ## Instructions

6
curriculum/challenges/english/05-apis-and-microservices/apis-and-microservices-projects/url-shortener-microservice.english.md
View File

@ -9,9 +9,9 @@ forumTopicId: 301509
## Description ## Description
<section id='description'> <section id='description'>
Build a full stack JavaScript app that is functionally similar to this: <a href='https://thread-paper.glitch.me/' target='_blank'>https://thread-paper.glitch.me/</a>. Build a full stack JavaScript app that is functionally similar to this: <a href='https://url-shortener.freecodecamp.repl.co/' target='_blank'>https://url-shortener.freecodecamp.repl.co/</a>.
Working on this project will involve you writing your code on Glitch on our starter project. After completing this project you can copy your public glitch url (to the homepage of your app) into this screen to test it! Optionally you may choose to write your project on another platform but it must be publicly visible for our testing. Working on this project will involve you writing your code on Repl.it on our starter project. After completing this project you can copy your public Repl.it URL (to the homepage of your app) into this screen to test it! Optionally you may choose to write your project on another platform but it must be publicly visible for our testing.
Start this project on Glitch using <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-project-urlshortener/' target='_blank'>this link</a> or clone <a href='https://github.com/freeCodeCamp/boilerplate-project-urlshortener/'>this repository</a> on GitHub! If you use Glitch, remember to save the link to your project somewhere safe! Start this project on Repl.it using <a href='https://repl.it/github/freeCodeCamp/boilerplate-project-urlshortener' target='_blank'>this link</a> or clone <a href='https://github.com/freeCodeCamp/boilerplate-project-urlshortener/'>this repository</a> on GitHub! If you use Repl.it, remember to save the link to your project somewhere safe!
</section> </section>
## Instructions ## Instructions

11
curriculum/challenges/english/05-apis-and-microservices/basic-node-and-express/meet-the-node-console.english.md
View File

@ -8,16 +8,19 @@ forumTopicId: 301515
## Description ## Description
<section id='description'> <section id='description'>
During the development process, it is important to be able to check what’s going on in your code. Node is just a JavaScript environment. Like client side JavaScript, you can use the console to display useful debug information. On your local machine, you would see the console output in a terminal. On Glitch you can open the logs in the lower part of the screen. You can toggle the log panel with the button ‘Logs’ (lower-left, inside the tools menu). During the development process, it is important to be able to check what’s going on in your code.
We recommend to keep the log panel open while working at these challenges. By reading the logs, you can be aware of the nature of errors that may occur.
Node is just a JavaScript environment. Like client side JavaScript, you can use the console to display useful debug information. On your local machine, you would see console output in a terminal. On Repl.it, a terminal is open in the right pane by default.
We recommend to keep the terminal open while working at these challenges. By reading the output in the terminal, you can see any errors that may occur.
</section> </section>
## Instructions ## Instructions
<section id='instructions'> <section id='instructions'>
If you have not already done so, please read the instructions in [the introduction](/learn/apis-and-microservices/basic-node-and-express/) and start a new project on Glitch using [this link](https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-express/). If you have not already done so, please read the instructions in [the introduction](/learn/apis-and-microservices/basic-node-and-express/) and start a new project on Repl.it using [this link](https://repl.it/github/freeCodeCamp/boilerplate-express).
Modify the <code>myApp.js</code> file to log "Hello World" to the console. Modify the <code>myApp.js</code> file to log "Hello World" to the console.
</section> </section>

4
curriculum/challenges/english/05-apis-and-microservices/basic-node-and-express/start-a-working-express-server.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301519
## Description ## Description
<section id='description'> <section id='description'>
In the first two lines of the file <code>myApp.js</code>, you can see how easy it is to create an Express app object. This object has several methods, and you will learn many of them in these challenges. One fundamental method is <code>app.listen(port)</code>. It tells your server to listen on a given port, putting it in running state. You can see it at the bottom of the file. It is inside comments because, for testing reasons, we need the app to be running in the background. All the code that you may want to add goes between these two fundamental parts. Glitch stores the port number in the environment variable <code>process.env.PORT</code>. Its value is <code>3000</code>. In the first two lines of the file <code>myApp.js</code>, you can see how easy it is to create an Express app object. This object has several methods, and you will learn many of them in these challenges. One fundamental method is <code>app.listen(port)</code>. It tells your server to listen on a given port, putting it in running state. You can see it at the bottom of the file. It is inside comments because, for testing reasons, we need the app to be running in the background. All the code that you may want to add goes between these two fundamental parts. Repl.it stores the port number in the environment variable <code>process.env.PORT</code>. Its value is <code>3000</code>.
Let’s serve our first string! In Express, routes takes the following structure: <code>app.METHOD(PATH, HANDLER)</code>. METHOD is an http method in lowercase. PATH is a relative path on the server (it can be a string, or even a regular expression). HANDLER is a function that Express calls when the route is matched. Let’s serve our first string! In Express, routes takes the following structure: <code>app.METHOD(PATH, HANDLER)</code>. METHOD is an http method in lowercase. PATH is a relative path on the server (it can be a string, or even a regular expression). HANDLER is a function that Express calls when the route is matched.
Handlers take the form <code>function(req, res) {...}</code>, where req is the request object, and res is the response object. For example, the handler Handlers take the form <code>function(req, res) {...}</code>, where req is the request object, and res is the response object. For example, the handler
@ -24,7 +24,7 @@ will serve the string 'Response String'.
## Instructions ## Instructions
<section id='instructions'> <section id='instructions'>
Use the <code>app.get()</code> method to serve the string "Hello Express" to GET requests matching the <code>/</code> (root) path. Use the <code>app.get()</code> method to serve the string "Hello Express" to GET requests matching the <code>/</code> (root) path.
<strong>Note:</strong> Be sure that your code works by looking at the logs, then see the results in your browser by clicking the ‘Show Live’ button if you are using Glitch. <strong>Note:</strong> Be sure that your code works by looking at the logs, then see the results in the preview if you are using Repl.it.
</section> </section>
## Tests ## Tests

2
curriculum/challenges/english/05-apis-and-microservices/mongodb-and-mongoose/create-a-model.english.md
View File

@ -14,7 +14,7 @@ First of all we need a Schema. Each schema maps to a MongoDB collection. It defi
Schemas are building block for Models. They can be nested to create complex models, but in this case we’ll keep things simple. Schemas are building block for Models. They can be nested to create complex models, but in this case we’ll keep things simple.
A model allows you to create instances of your objects, called documents. A model allows you to create instances of your objects, called documents.
Glitch is a real server, and in real servers the interactions with the db happen in handler functions. These function are executed when some event happens (e.g. someone hits an endpoint on your API). We’ll follow the same approach in these exercises. The <code>done()</code> function is a callback that tells us that we can proceed after completing an asynchronous operation such as inserting, searching, updating or deleting. It’s following the Node convention and should be called as <code>done(null, data)</code> on success, or <code>done(err)</code> on error. Repl.it is a real server, and in real servers the interactions with the db happen in handler functions. These function are executed when some event happens (e.g. someone hits an endpoint on your API). We’ll follow the same approach in these exercises. The <code>done()</code> function is a callback that tells us that we can proceed after completing an asynchronous operation such as inserting, searching, updating or deleting. It’s following the Node convention and should be called as <code>done(null, data)</code> on success, or <code>done(err)</code> on error.
Warning - When interacting with remote services, errors may occur! Warning - When interacting with remote services, errors may occur!
```js ```js

2
curriculum/challenges/english/06-quality-assurance/advanced-node-and-express/announce-new-users.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301546
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-socketio/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-socketio/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-socketio">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-socketio/'>GitHub</a>.
Many chat rooms are able to announce when a user connects or disconnects and then display that to all of the connected users in the chat. Seeing as though you already are emitting an event on connect and disconnect, you will just have to modify this event to support such feature. The most logical way of doing so is sending 3 pieces of data with the event: name of the user connected/disconnected, the current user count, and if that name connected or disconnected. Many chat rooms are able to announce when a user connects or disconnects and then display that to all of the connected users in the chat. Seeing as though you already are emitting an event on connect and disconnect, you will just have to modify this event to support such feature. The most logical way of doing so is sending 3 pieces of data with the event: name of the user connected/disconnected, the current user count, and if that name connected or disconnected.
<hr>Change the event name to 'user' and as the data pass an object along containing fields 'name', 'currentUsers', and boolean 'connected' (to be true if connection, or false for disconnection of the user sent). Be sure to make the change to both points we had the 'user count' event and set the disconnect one to sent false for field 'connected' instead of true like the event emitted on connect. <code>io.emit('user', {name: socket.request.user.name, currentUsers, connected: true});</code> <hr>Change the event name to 'user' and as the data pass an object along containing fields 'name', 'currentUsers', and boolean 'connected' (to be true if connection, or false for disconnection of the user sent). Be sure to make the change to both points we had the 'user count' event and set the disconnect one to sent false for field 'connected' instead of true like the event emitted on connect. <code>io.emit('user', {name: socket.request.user.name, currentUsers, connected: true});</code>
Now your client will have all the necessary information to correctly display the current user count and announce when a user connects or disconnects! To handle this event on the client side we should listen for 'user' and then update the current user count by using jQuery to change the text of <code>#num-users</code> to '{NUMBER} users online', as well as append a <code>&#60;li&#62;</code> to the unordered list with id 'messages' with '{NAME} has {joined/left} the chat.'. Now your client will have all the necessary information to correctly display the current user count and announce when a user connects or disconnects! To handle this event on the client side we should listen for 'user' and then update the current user count by using jQuery to change the text of <code>#num-users</code> to '{NUMBER} users online', as well as append a <code>&#60;li&#62;</code> to the unordered list with id 'messages' with '{NAME} has {joined/left} the chat.'.

2
curriculum/challenges/english/06-quality-assurance/advanced-node-and-express/authentication-strategies.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301547
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-advancednode/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-advancednode/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-advancednode">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-advancednode/'>GitHub</a>.
A strategy is a way of authenticating a user. You can use a strategy for allowing users to authenticate based on locally saved information (if you have them register first) or from a variety of providers such as Google or GitHub. For this project we will set up a local strategy. To see a list of the 100's of strategies, visit Passports site <a href='http://passportjs.org/'>here</a>. A strategy is a way of authenticating a user. You can use a strategy for allowing users to authenticate based on locally saved information (if you have them register first) or from a variety of providers such as Google or GitHub. For this project we will set up a local strategy. To see a list of the 100's of strategies, visit Passports site <a href='http://passportjs.org/'>here</a>.
Add <em>passport-local</em> as a dependency and add it to your server as follows: <code>const LocalStrategy = require('passport-local');</code> Add <em>passport-local</em> as a dependency and add it to your server as follows: <code>const LocalStrategy = require('passport-local');</code>
Now you will have to tell passport to <b>use</b> an instantiated LocalStrategy object with a few settings defined. Make sure this as well as everything from this point on is encapsulated in the database connection since it relies on it! Now you will have to tell passport to <b>use</b> an instantiated LocalStrategy object with a few settings defined. Make sure this as well as everything from this point on is encapsulated in the database connection since it relies on it!

2
curriculum/challenges/english/06-quality-assurance/advanced-node-and-express/authentication-with-socket.io.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301548
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-socketio/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-socketio/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-socketio">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-socketio/'>GitHub</a>.
Currently, you cannot determine who is connected to your web socket. While 'req.user' contains the user object, that's only when your user interacts with the web server and with web sockets you have no req (request) and therefore no user data. One way to solve the problem of knowing who is connected to your web socket is by parsing and decoding the cookie that contains the passport session then deserializing it to obtain the user object. Luckily, there is a package on NPM just for this that turns a once complex task into something simple! Currently, you cannot determine who is connected to your web socket. While 'req.user' contains the user object, that's only when your user interacts with the web server and with web sockets you have no req (request) and therefore no user data. One way to solve the problem of knowing who is connected to your web socket is by parsing and decoding the cookie that contains the passport session then deserializing it to obtain the user object. Luckily, there is a package on NPM just for this that turns a once complex task into something simple!
<hr>Add 'passport.socketio' as a dependency and require it as 'passportSocketIo'. <hr>Add 'passport.socketio' as a dependency and require it as 'passportSocketIo'.
Now we just have to tell Socket.IO to use it and set the options. Be sure this is added before the existing socket code and not in the existing connection listener. For your server it should look as follows: Now we just have to tell Socket.IO to use it and set the options. Be sure this is added before the existing socket code and not in the existing connection listener. For your server it should look as follows:

2
curriculum/challenges/english/06-quality-assurance/advanced-node-and-express/clean-up-your-project-with-modules.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301549
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-advancednode/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-advancednode/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-advancednode">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-advancednode/'>GitHub</a>.
Right now everything you have is in your server.js file. This can lead to hard to manage code that isn't very expandable. Right now everything you have is in your server.js file. This can lead to hard to manage code that isn't very expandable.
Create 2 new files: routes.js and auth.js Create 2 new files: routes.js and auth.js
Both should start with the following code: Both should start with the following code:

2
curriculum/challenges/english/06-quality-assurance/advanced-node-and-express/communicate-by-emitting.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301550
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-socketio/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-socketio/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-socketio">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-socketio/'>GitHub</a>.
<dfn>Emit</dfn> is the most common way of communicating you will use. When you emit something from the server to 'io', you send an event's name and data to all the connected sockets. A good example of this concept would be emitting the current count of connected users each time a new user connects! <dfn>Emit</dfn> is the most common way of communicating you will use. When you emit something from the server to 'io', you send an event's name and data to all the connected sockets. A good example of this concept would be emitting the current count of connected users each time a new user connects!
<hr>Start by adding a variable to keep track of the users just before where you are currently listening for connections. <code>var currentUsers = 0;</code> <hr>Start by adding a variable to keep track of the users just before where you are currently listening for connections. <code>var currentUsers = 0;</code>
Now when someone connects you should increment the count before emitting the count so you will want to add the incrementer within the connection listener. <code>++currentUsers;</code> Now when someone connects you should increment the count before emitting the count so you will want to add the incrementer within the connection listener. <code>++currentUsers;</code>

2
curriculum/challenges/english/06-quality-assurance/advanced-node-and-express/create-new-middleware.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301551
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-advancednode/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-advancednode/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-advancednode">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-advancednode/'>GitHub</a>.
As in, any user can just go to /profile whether they authenticated or not by typing in the url. We want to prevent this by checking if the user is authenticated first before rendering the profile page. This is the perfect example of when to create a middleware. As in, any user can just go to /profile whether they authenticated or not by typing in the url. We want to prevent this by checking if the user is authenticated first before rendering the profile page. This is the perfect example of when to create a middleware.
The challenge here is creating the middleware function <code>ensureAuthenticated(req, res, next)</code>, which will check if a user is authenticated by calling passports isAuthenticated on the <em>request</em> which in turn checks for <em>req.user</em> is to be defined. If it is then <em>next()</em> should be called, otherwise we can just respond to the request with a redirect to our homepage to login. An implementation of this middleware is: The challenge here is creating the middleware function <code>ensureAuthenticated(req, res, next)</code>, which will check if a user is authenticated by calling passports isAuthenticated on the <em>request</em> which in turn checks for <em>req.user</em> is to be defined. If it is then <em>next()</em> should be called, otherwise we can just respond to the request with a redirect to our homepage to login. An implementation of this middleware is:

2
curriculum/challenges/english/06-quality-assurance/advanced-node-and-express/handle-a-disconnect.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301552
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-socketio/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-socketio/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-socketio">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-socketio/'>GitHub</a>.
You may notice that up to now you have only been increasing the user count. Handling a user disconnecting is just as easy as handling the initial connect except the difference is you have to listen for it on each socket versus on the whole server. You may notice that up to now you have only been increasing the user count. Handling a user disconnecting is just as easy as handling the initial connect except the difference is you have to listen for it on each socket versus on the whole server.
<hr>To do this, add in to your existing connect listener a listener that listens for 'disconnect' on the socket with no data passed through. You can test this functionality by just logging to the console a user has disconnected. <code>socket.on('disconnect', () => { /*anything you want to do on disconnect*/ });</code> <hr>To do this, add in to your existing connect listener a listener that listens for 'disconnect' on the socket with no data passed through. You can test this functionality by just logging to the console a user has disconnected. <code>socket.on('disconnect', () => { /*anything you want to do on disconnect*/ });</code>
To make sure clients continuously have the updated count of current users, you should decrease the currentUsers by 1 when the disconnect happens then emit the 'user count' event with the updated count! To make sure clients continuously have the updated count of current users, you should decrease the currentUsers by 1 when the disconnect happens then emit the 'user count' event with the updated count!

2
curriculum/challenges/english/06-quality-assurance/advanced-node-and-express/hashing-your-passwords.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301553
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-advancednode/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-advancednode/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-advancednode">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-advancednode/'>GitHub</a>.
Going back to the information security section you may remember that storing plaintext passwords is <em>never</em> okay. Now it is time to implement BCrypt to solve this issue. Going back to the information security section you may remember that storing plaintext passwords is <em>never</em> okay. Now it is time to implement BCrypt to solve this issue.
<hr>Add BCrypt as a dependency and require it in your server. You will need to handle hashing in 2 key areas: where you handle registering/saving a new account and when you check to see that a password is correct on login. <hr>Add BCrypt as a dependency and require it in your server. You will need to handle hashing in 2 key areas: where you handle registering/saving a new account and when you check to see that a password is correct on login.
Currently on our registration route, you insert a user's password into the database like the following: <code>password: req.body.password</code>. An easy way to implement saving a hash instead is to add the following before your database logic <code>var hash = bcrypt.hashSync(req.body.password, 12);</code> and replacing the <code>req.body.password</code> in the database saving with just <code>password: hash</code>. Currently on our registration route, you insert a user's password into the database like the following: <code>password: req.body.password</code>. An easy way to implement saving a hash instead is to add the following before your database logic <code>var hash = bcrypt.hashSync(req.body.password, 12);</code> and replacing the <code>req.body.password</code> in the database saving with just <code>password: hash</code>.

2
curriculum/challenges/english/06-quality-assurance/advanced-node-and-express/how-to-put-a-profile-together.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301554
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-advancednode/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-advancednode/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-advancednode">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-advancednode/'>GitHub</a>.
Now that we can ensure the user accessing the <em>/profile</em> is authenticated, we can use the information contained in 'req.user' on our page! Now that we can ensure the user accessing the <em>/profile</em> is authenticated, we can use the information contained in 'req.user' on our page!
Go ahead and pass the object containing the variable <em>username</em> equaling 'req.user.username' into the render method of the profile view. Then go to your 'profile.pug' view and add the line <code>h2.center#welcome Welcome, #{username}!</code> creating the h2 element with the class 'center' and id 'welcome' containing the text 'Welcome, ' and the username! Go ahead and pass the object containing the variable <em>username</em> equaling 'req.user.username' into the render method of the profile view. Then go to your 'profile.pug' view and add the line <code>h2.center#welcome Welcome, #{username}!</code> creating the h2 element with the class 'center' and id 'welcome' containing the text 'Welcome, ' and the username!
Also in the profile, add a link to <em>/logout</em>. That route will host the logic to unauthenticate a user. <code>a(href='/logout') Logout</code> Also in the profile, add a link to <em>/logout</em>. That route will host the logic to unauthenticate a user. <code>a(href='/logout') Logout</code>

2
curriculum/challenges/english/06-quality-assurance/advanced-node-and-express/how-to-use-passport-strategies.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301555
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-advancednode/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-advancednode/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-advancednode">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-advancednode/'>GitHub</a>.
In the index.pug file supplied there is actually a login form. It has previously been hidden because of the inline JavaScript <code>if showLogin</code> with the form indented after it. Before <code>showLogin</code> as a variable was never defined, it never rendered the code block containing the form. Go ahead and on the <code>res.render</code> for that page add a new variable to the object <code>showLogin: true</code>. When you refresh your page, you should then see the form! This form is set up to <b>POST</b> on <em>/login</em> so this is where we should set up to accept the POST and authenticate the user. In the index.pug file supplied there is actually a login form. It has previously been hidden because of the inline JavaScript <code>if showLogin</code> with the form indented after it. Before <code>showLogin</code> as a variable was never defined, it never rendered the code block containing the form. Go ahead and on the <code>res.render</code> for that page add a new variable to the object <code>showLogin: true</code>. When you refresh your page, you should then see the form! This form is set up to <b>POST</b> on <em>/login</em> so this is where we should set up to accept the POST and authenticate the user.
For this challenge you should add the route /login to accept a POST request. To authenticate on this route you need to add a middleware to do so before then sending a response. This is done by just passing another argument with the middleware before your <code>function(req,res)</code> with your response! The middleware to use is <code>passport.authenticate('local')</code>. For this challenge you should add the route /login to accept a POST request. To authenticate on this route you need to add a middleware to do so before then sending a response. This is done by just passing another argument with the middleware before your <code>function(req,res)</code> with your response! The middleware to use is <code>passport.authenticate('local')</code>.
<em>passport.authenticate</em> can also take some options as an argument such as: <code>{ failureRedirect: '/' }</code> which is incredibly useful so be sure to add that in as well. As a response after using the middleware (which will only be called if the authentication middleware passes) should be to redirect the user to <em>/profile</em> and that route should render the view 'profile.pug'. <em>passport.authenticate</em> can also take some options as an argument such as: <code>{ failureRedirect: '/' }</code> which is incredibly useful so be sure to add that in as well. As a response after using the middleware (which will only be called if the authentication middleware passes) should be to redirect the user to <em>/profile</em> and that route should render the view 'profile.pug'.

2
curriculum/challenges/english/06-quality-assurance/advanced-node-and-express/implement-the-serialization-of-a-passport-user.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301556
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-advancednode/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-advancednode/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-advancednode">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-advancednode/'>GitHub</a>.
Right now we're not loading an actual user object since we haven't set up our database. This can be done many different ways, but for our project we will connect to the database once when we start the server and keep a persistent connection for the full life-cycle of the app. Right now we're not loading an actual user object since we haven't set up our database. This can be done many different ways, but for our project we will connect to the database once when we start the server and keep a persistent connection for the full life-cycle of the app.
To do this, add MongoDB as a dependency and require it in your server. (<code>const mongo = require('mongodb').MongoClient;</code>) To do this, add MongoDB as a dependency and require it in your server. (<code>const mongo = require('mongodb').MongoClient;</code>)
Now we want to the connect to our database then start listening for requests. The purpose of this is to not allow requests before our database is connected or if there is a database error. To accomplish you will want to encompass your serialization and your app listener in the following: Now we want to the connect to our database then start listening for requests. The purpose of this is to not allow requests before our database is connected or if there is a database error. To accomplish you will want to encompass your serialization and your app listener in the following:

2
curriculum/challenges/english/06-quality-assurance/advanced-node-and-express/implementation-of-social-authentication-ii.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301557
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-socialauth/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-socialauth/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-socialauth">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-socialauth/'>GitHub</a>.
The last part of setting up your GitHub authentication is to create the strategy itself. For this, you will need to add the dependency of 'passport-github' to your project and require it as GithubStrategy like <code>const GitHubStrategy = require('passport-github').Strategy;</code>. The last part of setting up your GitHub authentication is to create the strategy itself. For this, you will need to add the dependency of 'passport-github' to your project and require it as GithubStrategy like <code>const GitHubStrategy = require('passport-github').Strategy;</code>.
To set up the GitHub strategy, you have to tell <b>passport</b> to <b>use</b> an instantiated <b>GitHubStrategy</b>, which accepts 2 arguments: An object (containing <em>clientID</em>, <em>clientSecret</em>, and <em>callbackURL</em>) and a function to be called when a user is successfully authenticated which we will determine if the user is new and what fields to save initially in the user's database object. This is common across many strategies but some may require more information as outlined in that specific strategy's github README; for example, Google requires a <em>scope</em> as well which determines what kind of information your request is asking returned and asks the user to approve such access. The current strategy we are implementing has its usage outlined <a href='https://github.com/jaredhanson/passport-github/'>here</a>, but we're going through it all right here on freeCodeCamp! To set up the GitHub strategy, you have to tell <b>passport</b> to <b>use</b> an instantiated <b>GitHubStrategy</b>, which accepts 2 arguments: An object (containing <em>clientID</em>, <em>clientSecret</em>, and <em>callbackURL</em>) and a function to be called when a user is successfully authenticated which we will determine if the user is new and what fields to save initially in the user's database object. This is common across many strategies but some may require more information as outlined in that specific strategy's github README; for example, Google requires a <em>scope</em> as well which determines what kind of information your request is asking returned and asks the user to approve such access. The current strategy we are implementing has its usage outlined <a href='https://github.com/jaredhanson/passport-github/'>here</a>, but we're going through it all right here on freeCodeCamp!
Here's how your new strategy should look at this point: Here's how your new strategy should look at this point:

2
curriculum/challenges/english/06-quality-assurance/advanced-node-and-express/implementation-of-social-authentication-iii.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301558
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-socialauth/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-socialauth/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-socialauth">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-socialauth/'>GitHub</a>.
The final part of the strategy is handling the profile returned from GitHub. We need to load the user's database object if it exists, or create one if it doesn't, and populate the fields from the profile, then return the user's object. GitHub supplies us a unique <em>id</em> within each profile which we can use to search with to serialize the user with (already implemented). Below is an example implementation you can use in your project- it goes within the function that is the second argument for the new strategy, right below the <code>console.log(profile);</code> currently is: The final part of the strategy is handling the profile returned from GitHub. We need to load the user's database object if it exists, or create one if it doesn't, and populate the fields from the profile, then return the user's object. GitHub supplies us a unique <em>id</em> within each profile which we can use to search with to serialize the user with (already implemented). Below is an example implementation you can use in your project- it goes within the function that is the second argument for the new strategy, right below the <code>console.log(profile);</code> currently is:
```js ```js

4
curriculum/challenges/english/06-quality-assurance/advanced-node-and-express/implementation-of-social-authentication.english.md
View File

@ -8,10 +8,10 @@ forumTopicId: 301559
## Description ## Description
<section id='description'> <section id='description'>
For the following challenges, you will be working with a new starter project that is different from the previous one. You can find the new starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-socialauth/'>Glitch</a>, or clone it from <a href='https://github.com/freeCodeCamp/boilerplate-socialauth/'>GitHub</a>. For the following challenges, you will be working with a new starter project that is different from the previous one. You can find the new starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-socialauth">Repl.it</a>, or clone it from <a href='https://github.com/freeCodeCamp/boilerplate-socialauth/'>GitHub</a>.
The basic path this kind of authentication will follow in your app is: <ol><li>User clicks a button or link sending them to our route to authenticate using a specific strategy (EG. GitHub)</li><li>Your route calls <code>passport.authenticate('github')</code> which redirects them to GitHub.</li><li>The page the user lands on, on GitHub, allows them to login if they aren't already. It then asks them to approve access to their profile from our app.</li><li>The user is then returned to our app at a specific callback url with their profile if they are approved.</li><li>They are now authenticated and your app should check if it is a returning profile, or save it in your database if it is not.</li></ol> The basic path this kind of authentication will follow in your app is: <ol><li>User clicks a button or link sending them to our route to authenticate using a specific strategy (EG. GitHub)</li><li>Your route calls <code>passport.authenticate('github')</code> which redirects them to GitHub.</li><li>The page the user lands on, on GitHub, allows them to login if they aren't already. It then asks them to approve access to their profile from our app.</li><li>The user is then returned to our app at a specific callback url with their profile if they are approved.</li><li>They are now authenticated and your app should check if it is a returning profile, or save it in your database if it is not.</li></ol>
Strategies with OAuth require you to have at least a <em>Client ID</em> and a <em>Client Secret</em> which is a way for them to verify who the authentication request is coming from and if it is valid. These are obtained from the site you are trying to implement authentication with, such as GitHub, and are unique to your app- <b>THEY ARE NOT TO BE SHARED</b> and should never be uploaded to a public repository or written directly in your code. A common practice is to put them in your <em>.env</em> file and reference them like: <code>process.env.GITHUB_CLIENT_ID</code>. For this challenge we're going to use the GitHub strategy. Strategies with OAuth require you to have at least a <em>Client ID</em> and a <em>Client Secret</em> which is a way for them to verify who the authentication request is coming from and if it is valid. These are obtained from the site you are trying to implement authentication with, such as GitHub, and are unique to your app- <b>THEY ARE NOT TO BE SHARED</b> and should never be uploaded to a public repository or written directly in your code. A common practice is to put them in your <em>.env</em> file and reference them like: <code>process.env.GITHUB_CLIENT_ID</code>. For this challenge we're going to use the GitHub strategy.
Obtaining your <em>Client ID and Secret</em> from GitHub is done in your account profile settings under 'developer settings', then '<a href='https://github.com/settings/developers'>OAuth applications</a>'. Click 'Register a new application', name your app, paste in the url to your glitch homepage (<b>Not the project code's url</b>), and lastly for the callback url, paste in the same url as the homepage but with '/auth/github/callback' added on. This is where users will be redirected to for us to handle after authenticating on GitHub. Save the returned information as 'GITHUB_CLIENT_ID' and 'GITHUB_CLIENT_SECRET' in your .env file. Obtaining your <em>Client ID and Secret</em> from GitHub is done in your account profile settings under 'developer settings', then '<a href='https://github.com/settings/developers'>OAuth applications</a>'. Click 'Register a new application', name your app, paste in the url to your Repl.it homepage (<b>Not the project code's url</b>), and lastly for the callback url, paste in the same url as the homepage but with '/auth/github/callback' added on. This is where users will be redirected to for us to handle after authenticating on GitHub. Save the returned information as 'GITHUB_CLIENT_ID' and 'GITHUB_CLIENT_SECRET' in your .env file.
On your remixed project, create 2 routes accepting GET requests: /auth/github and /auth/github/callback. The first should only call passport to authenticate 'github' and the second should call passport to authenticate 'github' with a failure redirect to '/' and then if that is successful redirect to '/profile' (similar to our last project). On your remixed project, create 2 routes accepting GET requests: /auth/github and /auth/github/callback. The first should only call passport to authenticate 'github' and the second should call passport to authenticate 'github' with a failure redirect to '/' and then if that is successful redirect to '/profile' (similar to our last project).
An example of how '/auth/github/callback' should look is similar to how we handled a normal login in our last project: An example of how '/auth/github/callback' should look is similar to how we handled a normal login in our last project:

2
curriculum/challenges/english/06-quality-assurance/advanced-node-and-express/logging-a-user-out.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301560
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-advancednode/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-advancednode/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-advancednode">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-advancednode/'>GitHub</a>.
Creating the logout logic is easy. The route should just unauthenticate the user and redirect to the home page instead of rendering any view. Creating the logout logic is easy. The route should just unauthenticate the user and redirect to the home page instead of rendering any view.
In passport, unauthenticating a user is as easy as just calling <code>req.logout();</code> before redirecting. In passport, unauthenticating a user is as easy as just calling <code>req.logout();</code> before redirecting.

2
curriculum/challenges/english/06-quality-assurance/advanced-node-and-express/registration-of-new-users.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301561
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-advancednode/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-advancednode/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-advancednode">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-advancednode/'>GitHub</a>.
Now we need to allow a new user on our site to register an account. On the res.render for the home page add a new variable to the object passed along- <code>showRegistration: true</code>. When you refresh your page, you should then see the registration form that was already created in your index.pug file! This form is set up to <b>POST</b> on <em>/register</em> so this is where we should set up to accept the POST and create the user object in the database. Now we need to allow a new user on our site to register an account. On the res.render for the home page add a new variable to the object passed along- <code>showRegistration: true</code>. When you refresh your page, you should then see the registration form that was already created in your index.pug file! This form is set up to <b>POST</b> on <em>/register</em> so this is where we should set up to accept the POST and create the user object in the database.
The logic of the registration route should be as follows: Register the new user > Authenticate the new user > Redirect to /profile The logic of the registration route should be as follows: Register the new user > Authenticate the new user > Redirect to /profile
The logic of step 1, registering the new user, should be as follows: Query database with a findOne command > if user is returned then it exists and redirect back to home <em>OR</em> if user is undefined and no error occurs then 'insertOne' into the database with the username and password and as long as no errors occur then call <em>next</em> to go to step 2, authenticating the new user, which we've already written the logic for in our POST /login route. The logic of step 1, registering the new user, should be as follows: Query database with a findOne command > if user is returned then it exists and redirect back to home <em>OR</em> if user is undefined and no error occurs then 'insertOne' into the database with the username and password and as long as no errors occur then call <em>next</em> to go to step 2, authenticating the new user, which we've already written the logic for in our POST /login route.

2
curriculum/challenges/english/06-quality-assurance/advanced-node-and-express/send-and-display-chat-messages.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301562
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-socketio/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-socketio/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-socketio">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-socketio/'>GitHub</a>.
It's time you start allowing clients to send a chat message to the server to emit to all the clients! Already in your client.js file you should see there is already a block of code handling when the message form is submitted. (<code>$('form').submit(function(){ /*logic*/ });</code>) It's time you start allowing clients to send a chat message to the server to emit to all the clients! Already in your client.js file you should see there is already a block of code handling when the message form is submitted. (<code>$('form').submit(function(){ /*logic*/ });</code>)
<hr>Within the form submit code, you should emit an event after you define 'messageToSend' but before you clear the text box <code>#m</code>. The event should be named 'chat message' and the data should just be 'messageToSend'. <code>socket.emit('chat message', messageToSend);</code> <hr>Within the form submit code, you should emit an event after you define 'messageToSend' but before you clear the text box <code>#m</code>. The event should be named 'chat message' and the data should just be 'messageToSend'. <code>socket.emit('chat message', messageToSend);</code>
Now on your server you should be listening to the socket for the event 'chat message' with the data being named 'message'. Once the event is received it should then emit the event 'chat message' to all sockets <code>io.emit</code> with the data being an object containing 'name' and 'message'. Now on your server you should be listening to the socket for the event 'chat message' with the data being named 'message'. Once the event is received it should then emit the event 'chat message' to all sockets <code>io.emit</code> with the data being an object containing 'name' and 'message'.

2
curriculum/challenges/english/06-quality-assurance/advanced-node-and-express/serialization-of-a-user-object.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301563
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-advancednode/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-advancednode/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-advancednode">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-advancednode/'>GitHub</a>.
Serialization and deserialization are important concepts in regards to authentication. To serialize an object means to convert its contents into a small <em>key</em> essentially that can then be deserialized into the original object. This is what allows us to know whos communicated with the server without having to send the authentication data like username and password at each request for a new page. Serialization and deserialization are important concepts in regards to authentication. To serialize an object means to convert its contents into a small <em>key</em> essentially that can then be deserialized into the original object. This is what allows us to know whos communicated with the server without having to send the authentication data like username and password at each request for a new page.
To set this up properly, we need to have a serialize function and a deserialize function. In passport we create these with <code>passport.serializeUser( OURFUNCTION )</code> and <code>passport.deserializeUser( OURFUNCTION )</code> To set this up properly, we need to have a serialize function and a deserialize function. In passport we create these with <code>passport.serializeUser( OURFUNCTION )</code> and <code>passport.deserializeUser( OURFUNCTION )</code>
The serializeUser is called with 2 arguments, the full user object and a callback used by passport. Returned in the callback should be a unique key to identify that user- the easiest one to use being the users _id in the object as it should be unique as it generated by MongoDb. Similarly deserializeUser is called with that key and a callback function for passport as well, but this time we have to take that key and return the users full object to the callback. To make a query search for a Mongo _id you will have to create <code>const ObjectID = require('mongodb').ObjectID;</code>, and then to use it you call <code>new ObjectID(THE_ID)</code>. Be sure to add MongoDB as a dependency. You can see this in the examples below: The serializeUser is called with 2 arguments, the full user object and a callback used by passport. Returned in the callback should be a unique key to identify that user- the easiest one to use being the users _id in the object as it should be unique as it generated by MongoDb. Similarly deserializeUser is called with that key and a callback function for passport as well, but this time we have to take that key and return the users full object to the callback. To make a query search for a Mongo _id you will have to create <code>const ObjectID = require('mongodb').ObjectID;</code>, and then to use it you call <code>new ObjectID(THE_ID)</code>. Be sure to add MongoDB as a dependency. You can see this in the examples below:

2
curriculum/challenges/english/06-quality-assurance/advanced-node-and-express/set-up-a-template-engine.english.md
View File

@ -9,7 +9,7 @@ forumTopicId: 301564
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-advancednode/'>Glitch</a>, or clone from <a href='https://github.com/freeCodeCamp/boilerplate-advancednode/'>GitHub</a>. As a reminder, this project is built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-advancednode">Repl.it</a>, or clone from <a href='https://github.com/freeCodeCamp/boilerplate-advancednode/'>GitHub</a>.
A template engine enables you to use static template files (such as those written in <em>Pug</em>) in your app. At runtime, the template engine replaces variables in a template file with actual values which can be supplied by your server. Then it transforms the template into a static HTML file that is sent to the client. This approach makes it easier to design an HTML page and allows for displaying variables on the page without needing to make an API call from the client. A template engine enables you to use static template files (such as those written in <em>Pug</em>) in your app. At runtime, the template engine replaces variables in a template file with actual values which can be supplied by your server. Then it transforms the template into a static HTML file that is sent to the client. This approach makes it easier to design an HTML page and allows for displaying variables on the page without needing to make an API call from the client.
To set up <em>Pug</em> for use in your project, you will need to add it as a dependency in your package.json. Don't forget to add the name of the package and the version. Use the package.json for some examples of the correct syntax. To set up <em>Pug</em> for use in your project, you will need to add it as a dependency in your package.json. Don't forget to add the name of the package and the version. Use the package.json for some examples of the correct syntax.

2
curriculum/challenges/english/06-quality-assurance/advanced-node-and-express/set-up-passport.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301565
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-advancednode/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-advancednode/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-advancednode">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-advancednode/'>GitHub</a>.
It's time to set up <em>Passport</em> so we can finally start allowing a user to register or login to an account! In addition to Passport, we will use Express-session to handle sessions. Using this middleware saves the session id as a cookie in the client and allows us to access the session data using that id on the server. This way we keep personal account information out of the cookie used by the client to verify to our server they are authenticated and just keep the <em>key</em> to access the data stored on the server. It's time to set up <em>Passport</em> so we can finally start allowing a user to register or login to an account! In addition to Passport, we will use Express-session to handle sessions. Using this middleware saves the session id as a cookie in the client and allows us to access the session data using that id on the server. This way we keep personal account information out of the cookie used by the client to verify to our server they are authenticated and just keep the <em>key</em> to access the data stored on the server.
To set up Passport for use in your project, you will need to add it as a dependency first in your package.json. <code>"passport": "^0.3.2"</code> To set up Passport for use in your project, you will need to add it as a dependency first in your package.json. <code>"passport": "^0.3.2"</code>
In addition, add Express-session as a dependency now as well. Express-session has a ton of advanced features you can use but for now we're just going to use the basics! <code>"express-session": "^1.15.0"</code> In addition, add Express-session as a dependency now as well. Express-session has a ton of advanced features you can use but for now we're just going to use the basics! <code>"express-session": "^1.15.0"</code>

2
curriculum/challenges/english/06-quality-assurance/advanced-node-and-express/set-up-the-environment.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301566
## Description ## Description
<section id='description'> <section id='description'>
For the following challenges, you will be working with a new starter project that is different from the previous one. You can find the new starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-socketio/'>Glitch</a>, or clone it from <a href='https://github.com/freeCodeCamp/boilerplate-socketio/'>GitHub</a>. For the following challenges, you will be working with a new starter project that is different from the previous one. You can find the new starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-socketio">Repl.it</a>, or clone it from <a href='https://github.com/freeCodeCamp/boilerplate-socketio/'>GitHub</a>.
Add Socket.IO as a dependency and require/instantiate it in your server defined as 'io' with the http server as an argument. <code>const io = require('socket.io')(http);</code> Add Socket.IO as a dependency and require/instantiate it in your server defined as 'io' with the http server as an argument. <code>const io = require('socket.io')(http);</code>
The first thing needing to be handled is listening for a new connection from the client. The <dfn>on</dfn> keyword does just that- listen for a specific event. It requires 2 arguments: a string containing the title of the event thats emitted, and a function with which the data is passed though. In the case of our connection listener, we use <em>socket</em> to define the data in the second argument. A socket is an individual client who is connected. The first thing needing to be handled is listening for a new connection from the client. The <dfn>on</dfn> keyword does just that- listen for a specific event. It requires 2 arguments: a string containing the title of the event thats emitted, and a function with which the data is passed though. In the case of our connection listener, we use <em>socket</em> to define the data in the second argument. A socket is an individual client who is connected.
For listening for connections on our server, add the following between the comments in your project: For listening for connections on our server, add the following between the comments in your project:

2
curriculum/challenges/english/06-quality-assurance/advanced-node-and-express/use-a-template-engines-powers.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301567
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-advancednode/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-advancednode/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-advancednode">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-advancednode/'>GitHub</a>.
One of the greatest features of using a template engine is being able to pass variables from the server to the template file before rendering it to HTML. One of the greatest features of using a template engine is being able to pass variables from the server to the template file before rendering it to HTML.
In your Pug file, you're able to use a variable by referencing the variable name as <code>#{variable_name}</code> inline with other text on an element or by using an equal sign on the element without a space such as <code>p=variable_name</code> which assigns the variable's value to the p element's text. In your Pug file, you're able to use a variable by referencing the variable name as <code>#{variable_name}</code> inline with other text on an element or by using an equal sign on the element without a space such as <code>p=variable_name</code> which assigns the variable's value to the p element's text.
We strongly recommend looking at the syntax and structure of Pug <a href='https://github.com/pugjs/pug'>here</a> on GitHub's README. Pug is all about using whitespace and tabs to show nested elements and cutting down on the amount of code needed to make a beautiful site. We strongly recommend looking at the syntax and structure of Pug <a href='https://github.com/pugjs/pug'>here</a> on GitHub's README. Pug is all about using whitespace and tabs to show nested elements and cutting down on the amount of code needed to make a beautiful site.

2
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/assert-deep-equality-with-.deepequal-and-.notdeepequal.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301587
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-mochachai/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
<code>deepEqual()</code> asserts that two object are deep equal. <code>deepEqual()</code> asserts that two object are deep equal.
</section> </section>

2
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/compare-the-properties-of-two-elements.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301588
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-mochachai/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
</section> </section>
## Instructions ## Instructions

2
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/learn-how-javascript-assertions-work.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301589
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-mochachai/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
</section> </section>

2
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-an-api-response-using-chai-http-iii---put-method.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301590
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-mochachai/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
In the next example we'll see how to send data in a request payload (body). In the next example we'll see how to send data in a request payload (body).
We are going to test a PUT request. The <code>'/travellers'</code> endpoint accepts a JSON object taking the structure : We are going to test a PUT request. The <code>'/travellers'</code> endpoint accepts a JSON object taking the structure :

2
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-an-api-response-using-chai-http-iv---put-method.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301591
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-mochachai/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
This exercise is similar to the preceding. Look at it for the details. This exercise is similar to the preceding. Look at it for the details.
</section> </section>

2
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-api-endpoints-using-chai-http-ii.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301592
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-mochachai/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
</section> </section>

2
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-api-endpoints-using-chai-http.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301593
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-mochachai/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
</section> </section>

2
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-using-a-headless-browser-ii.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301594
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-mochachai/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
</section> </section>

4
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-using-a-headless-browser.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301595
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-mochachai/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
In the next challenges we are going to simulate the human interaction with a page using a device called 'Headless Browser'. In the next challenges we are going to simulate the human interaction with a page using a device called 'Headless Browser'.
A headless browser is a web browser without a graphical user interface. These kind of tools are particularly useful for testing web pages as they are able to render and understand HTML, CSS, and JavaScript the same way a browser would. A headless browser is a web browser without a graphical user interface. These kind of tools are particularly useful for testing web pages as they are able to render and understand HTML, CSS, and JavaScript the same way a browser would.
@ -16,7 +16,7 @@ A headless browser is a web browser without a graphical user interface. These ki
## Instructions ## Instructions
<section id='instructions'> <section id='instructions'>
For these challenges we are using Zombie.JS. It's a lightweight browser which is totally based on JS, without relying on additional binaries to be installed. This feature makes it usable in an environment such as Glitch. There are many other (more powerful) options.<br> For these challenges we are using Zombie.JS. It's a lightweight browser which is totally based on JS, without relying on additional binaries to be installed. This feature makes it usable in an environment such as Repl.it. There are many other (more powerful) options.<br>
Look at the examples in the code for the exercise directions Follow the assertions order, We rely on it. Look at the examples in the code for the exercise directions Follow the assertions order, We rely on it.
</section> </section>

2
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/test-for-truthiness.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301596
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-mochachai/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
<code>isTrue()</code> will test for the boolean value true and <code>isNotTrue()</code> will pass when given anything but the boolean value of true. <code>isTrue()</code> will test for the boolean value true and <code>isNotTrue()</code> will pass when given anything but the boolean value of true.

2
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-string-contains-a-substring.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301597
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-mochachai/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
<code>include()</code> and <code>notInclude()</code> work for strings too! <code>include()</code> and <code>notInclude()</code> work for strings too!
<code>include()</code> asserts that the actual string contains the expected substring. <code>include()</code> asserts that the actual string contains the expected substring.

2
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-falls-within-a-specific-range.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301598
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-mochachai/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
<code>.approximately(actual, expected, delta, [message])</code> <code>.approximately(actual, expected, delta, [message])</code>
Asserts that the actual is equal <code>expected</code>, to within a +/- <code>delta</code> range. Asserts that the actual is equal <code>expected</code>, to within a +/- <code>delta</code> range.

2
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-a-string.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301599
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-mochachai/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
<code>isString</code> or <code>isNotString</code> asserts that the actual value is a string. <code>isString</code> or <code>isNotString</code> asserts that the actual value is a string.
</section> </section>

2
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-an-array.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301600
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-mochachai/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
</section> </section>
## Instructions ## Instructions

2
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-of-a-specific-data-structure-type.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301601
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-mochachai/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
<code>#typeOf</code> asserts that value’s type is the given string, as determined by <code>Object.prototype.toString</code>. <code>#typeOf</code> asserts that value’s type is the given string, as determined by <code>Object.prototype.toString</code>.
</section> </section>

2
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-variable-or-function-is-defined.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301602
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-mochachai/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
</section> </section>

2
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-array-contains-an-item.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301603
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-mochachai/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
</section> </section>
## Instructions ## Instructions

2
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-object-has-a-property.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301604
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-mochachai/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
<code>property</code> asserts that the actual object has a given property. <code>property</code> asserts that the actual object has a given property.
</section> </section>

2
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-object-is-an-instance-of-a-constructor.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301605
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-mochachai/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
<code>#instanceOf</code> asserts that an object is an instance of a constructor. <code>#instanceOf</code> asserts that an object is an instance of a constructor.
</section> </section>

2
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/test-if-one-value-is-below-or-at-least-as-large-as-another.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301606
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-mochachai/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
</section> </section>
## Instructions ## Instructions

2
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/use-assert.isok-and-assert.isnotok.english.md
View File

@ -9,7 +9,7 @@ forumTopicId: 301607
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-mochachai/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
<code>isOk()</code> will test for a truthy value and <code>isNotOk()</code> will test for a falsy value. <code>isOk()</code> will test for a truthy value and <code>isNotOk()</code> will test for a falsy value.
To learn more about truthy and falsy values, try our <a href="https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/basic-algorithm-scripting/falsy-bouncer" target="_blank">Falsy Bouncer</a> challenge. To learn more about truthy and falsy values, try our <a href="https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/basic-algorithm-scripting/falsy-bouncer" target="_blank">Falsy Bouncer</a> challenge.

2
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/use-regular-expressions-to-test-a-string.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301608
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-mochachai/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
<code>match()</code> asserts that the actual value matches the second argument regular expression. <code>match()</code> asserts that the actual value matches the second argument regular expression.
</section> </section>

2
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/use-the-double-equals-to-assert-equality.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301609
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-mochachai/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
<code>equal()</code> compares objects using <code>==</code>. <code>equal()</code> compares objects using <code>==</code>.
</section> </section>

2
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/use-the-triple-equals-to-assert-strict-equality.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301610
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-mochachai/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
<code>strictEqual()</code> compares objects using <code>===</code>. <code>strictEqual()</code> compares objects using <code>===</code>.
</section> </section>

6
curriculum/challenges/english/06-quality-assurance/quality-assurance-projects/american-british-translator.english.md
View File

@ -8,11 +8,11 @@ isRequired: true
## Description ## Description
<section id='description'> <section id='description'>
Build a full stack JavaScript app that is functionally similar to this: <a href='https://youthful-grave-scabiosa.glitch.me/' target='_blank'>https://youthful-grave-scabiosa.glitch.me/</a>. Build a full stack JavaScript app that is functionally similar to this: <a href="https://americanbritish-english-translator--freecodecamp.repl.co/" target="_blank">https://americanbritish-english-translator--freecodecamp.repl.co/</a>.
Working on this project will involve you writing your code on Glitch on our starter project. After completing this project you can copy your public glitch url (to the homepage of your app) into this screen to test it! Optionally you may choose to write your project on another platform but it must be publicly visible for our testing. Working on this project will involve you writing your code on Repl.it on our starter project. After completing this project you can copy your public Repl.it URL (to the homepage of your app) into this screen to test it! Optionally you may choose to write your project on another platform but it must be publicly visible for our testing.
Start this project on Glitch using <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-project-american-british-english-translator/'>this link</a> or clone <a href='https://github.com/freeCodeCamp/boilerplate-project-american-british-english-translator/'>this repository</a> on GitHub! If you use Glitch, remember to save the link to your project somewhere safe! Start this project on Repl.it using <a href="https://repl.it/github/freeCodeCamp/boilerplate-project-american-british-english-translator">this link</a> or clone <a href='https://github.com/freeCodeCamp/boilerplate-project-american-british-english-translator/'>this repository</a> on GitHub! If you use Repl.it, remember to save the link to your project somewhere safe!
</section> </section>
## Instructions ## Instructions

6
curriculum/challenges/english/06-quality-assurance/quality-assurance-projects/issue-tracker.english.md
View File

@ -9,9 +9,9 @@ forumTopicId: 301569
## Description ## Description
<section id='description'> <section id='description'>
Build a full stack JavaScript app that is functionally similar to this: <a href='https://protective-garage.glitch.me/' target='_blank'>https://protective-garage.glitch.me/</a>. Build a full stack JavaScript app that is functionally similar to this: <a href="https://issue-tracker--freecodecamp.repl.co/" target="_blank">https://issue-tracker--freecodecamp.repl.co/</a>.
Working on this project will involve you writing your code on Glitch on our starter project. After completing this project you can copy your public glitch url (to the homepage of your app) into this screen to test it! Optionally you may choose to write your project on another platform but it must be publicly visible for our testing. Working on this project will involve you writing your code on Repl.it on our starter project. After completing this project you can copy your public Repl.it URL (to the homepage of your app) into this screen to test it! Optionally you may choose to write your project on another platform but it must be publicly visible for our testing.
Start this project on Glitch using <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-project-issuetracker/'>this link</a> or clone <a href='https://github.com/freeCodeCamp/boilerplate-project-issuetracker/'>this repository</a> on GitHub! If you use Glitch, remember to save the link to your project somewhere safe! Start this project on Repl.it using <a href="https://repl.it/github/freeCodeCamp/boilerplate-project-issuetracker">this link</a> or clone <a href='https://github.com/freeCodeCamp/boilerplate-project-issuetracker/'>this repository</a> on GitHub! If you use Repl.it, remember to save the link to your project somewhere safe!
</section> </section>
## Instructions ## Instructions

6
curriculum/challenges/english/06-quality-assurance/quality-assurance-projects/metric-imperial-converter.english.md
View File

@ -9,9 +9,9 @@ forumTopicId: 301570
## Description ## Description
<section id='description'> <section id='description'>
Build a full stack JavaScript app that is functionally similar to this: <a href='https://incongruous-beard.glitch.me/' target='_blank'>https://incongruous-beard.glitch.me/</a>. Build a full stack JavaScript app that is functionally similar to this: <a href="https://metric-imperial-converter--freecodecamp.repl.co/" target="_blank">https://metric-imperial-converter--freecodecamp.repl.co/</a>.
Working on this project will involve you writing your code on Glitch on our starter project. After completing this project you can copy your public glitch url (to the homepage of your app) into this screen to test it! Optionally you may choose to write your project on another platform but it must be publicly visible for our testing. Working on this project will involve you writing your code on Repl.it on our starter project. After completing this project you can copy your public Repl.it URL (to the homepage of your app) into this screen to test it! Optionally you may choose to write your project on another platform but it must be publicly visible for our testing.
Start this project on Glitch using <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-project-metricimpconverter/'>this link</a> or clone <a href='https://github.com/freeCodeCamp/boilerplate-project-metricimpconverter/'>this repository</a> on GitHub! If you use Glitch, remember to save the link to your project somewhere safe! Start this project on Repl.it using <a href="https://repl.it/github/freeCodeCamp/boilerplate-project-metricimpconverter">this link</a> or clone <a href='https://github.com/freeCodeCamp/boilerplate-project-metricimpconverter/'>this repository</a> on GitHub! If you use Repl.it, remember to save the link to your project somewhere safe!
</section> </section>
## Instructions ## Instructions

6
curriculum/challenges/english/06-quality-assurance/quality-assurance-projects/personal-library.english.md
View File

@ -9,9 +9,9 @@ forumTopicId: 301571
## Description ## Description
<section id='description'> <section id='description'>
Build a full stack JavaScript app that is functionally similar to this: <a href='https://fuzzy-mink.glitch.me/' target='_blank'>https://fuzzy-mink.glitch.me/</a>. Build a full stack JavaScript app that is functionally similar to this: <a href="https://personal-library--freecodecamp.repl.co/" target="_blank">https://personal-library--freecodecamp.repl.co/</a>.
Working on this project will involve you writing your code on Glitch on our starter project. After completing this project you can copy your public glitch url (to the homepage of your app) into this screen to test it! Optionally you may choose to write your project on another platform but must be publicly visible for our testing. Working on this project will involve you writing your code on Repl.it on our starter project. After completing this project you can copy your public Repl.it URL (to the homepage of your app) into this screen to test it! Optionally you may choose to write your project on another platform but must be publicly visible for our testing.
Start this project on Glitch using <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-project-library/'>this link</a> or clone <a href='https://github.com/freeCodeCamp/boilerplate-project-library/'>this repository</a> on GitHub! If you use Glitch, remember to save the link to your project somewhere safe! Start this project on Repl.it using <a href="https://repl.it/github/freeCodeCamp/boilerplate-project-metricimpconverter">this link</a> or clone <a href='https://github.com/freeCodeCamp/boilerplate-project-library/'>this repository</a> on GitHub! If you use Repl.it, remember to save the link to your project somewhere safe!
</section> </section>
## Instructions ## Instructions

6
curriculum/challenges/english/06-quality-assurance/quality-assurance-projects/sudoku-solver.english.md
View File

@ -8,11 +8,11 @@ isRequired: true
## Description ## Description
<section id='description'> <section id='description'>
Build a full stack JavaScript app that is functionally similar to this: <a href='https://bottlenose-eucalyptus.glitch.me/' target='_blank'>https://bottlenose-eucalyptus.glitch.me/</a>. Build a full stack JavaScript app that is functionally similar to this: <a href="https://sudoku-solver--freecodecamp.repl.co/" target="_blank">https://sudoku-solver--freecodecamp.repl.co/</a>.
Working on this project will involve you writing your code on Glitch on our starter project. After completing this project you can copy your public glitch url (to the homepage of your app) into this screen to test it! Optionally you may choose to write your project on another platform but it must be publicly visible for our testing. Working on this project will involve you writing your code on Repl.it on our starter project. After completing this project you can copy your public Repl.it URL (to the homepage of your app) into this screen to test it! Optionally you may choose to write your project on another platform but it must be publicly visible for our testing.
Start this project on Glitch using <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-project-sudoku-solver/'>this link</a> or clone <a href='https://github.com/freeCodeCamp/boilerplate-project-sudoku-solver/'>this repository</a> on GitHub! If you use Glitch, remember to save the link to your project somewhere safe! Start this project on Repl.it using <a href="https://repl.it/github/freeCodeCamp/boilerplate-project-sudoku-solver">this link</a> or clone <a href='https://github.com/freeCodeCamp/boilerplate-project-sudoku-solver/'>this repository</a> on GitHub! If you use Repl.it, remember to save the link to your project somewhere safe!
</section> </section>
## Instructions ## Instructions

2
curriculum/challenges/english/07-scientific-computing-with-python/scientific-computing-with-python-projects/arithmetic-formatter.english.md
View File

@ -10,7 +10,7 @@ isRequired: true
<section id='description'> <section id='description'>
Create a function that receives a list of strings that are arithmetic problems and returns the problems arranged vertically and side-by-side. Create a function that receives a list of strings that are arithmetic problems and returns the problems arranged vertically and side-by-side.
You can access <a href='https://repl.it/@freeCodeCamp/fcc-arithmetic-arranger' target='_blank'>the full project description and starter code on repl.it</a>. You can access <a href='https://repl.it/@freeCodeCamp/fcc-arithmetic-arranger' target='_blank'>the full project description and starter code on Repl.it</a>.
After going to that link, fork the project. Once you complete the project based on the instructions in 'README.md', submit your project link below. After going to that link, fork the project. Once you complete the project based on the instructions in 'README.md', submit your project link below.

2
curriculum/challenges/english/07-scientific-computing-with-python/scientific-computing-with-python-projects/budget-app.english.md
View File

@ -10,7 +10,7 @@ isRequired: true
<section id='description'> <section id='description'>
Create a "Category" class that can be used to create different budget categories. Create a "Category" class that can be used to create different budget categories.
You can access <a href='https://repl.it/@freeCodeCamp/fcc-budget-app' target='_blank'>the full project description and starter code on repl.it</a>. You can access <a href='https://repl.it/@freeCodeCamp/fcc-budget-app' target='_blank'>the full project description and starter code on Repl.it</a>.
After going to that link, fork the project. Once you complete the project based on the instructions in 'README.md', submit your project link below. After going to that link, fork the project. Once you complete the project based on the instructions in 'README.md', submit your project link below.

2
curriculum/challenges/english/07-scientific-computing-with-python/scientific-computing-with-python-projects/polygon-area-calculator.english.md
View File

@ -10,7 +10,7 @@ isRequired: true
<section id='description'> <section id='description'>
In this project you will use object oriented programming to create a Rectangle class and a Square class. The Square class should be a subclass of Rectangle and inherit methods and attributes. In this project you will use object oriented programming to create a Rectangle class and a Square class. The Square class should be a subclass of Rectangle and inherit methods and attributes.
You can access <a href='https://repl.it/@freeCodeCamp/fcc-shape-calculator' target='_blank'>the full project description and starter code on repl.it</a>. You can access <a href='https://repl.it/@freeCodeCamp/fcc-shape-calculator' target='_blank'>the full project description and starter code on Repl.it</a>.
After going to that link, fork the project. Once you complete the project based on the instructions in 'README.md', submit your project link below. After going to that link, fork the project. Once you complete the project based on the instructions in 'README.md', submit your project link below.

2
curriculum/challenges/english/07-scientific-computing-with-python/scientific-computing-with-python-projects/probability-calculator.english.md
View File

@ -10,7 +10,7 @@ isRequired: true
<section id='description'> <section id='description'>
Write a program to determine the approximate probability of drawing certain balls randomly from a hat. Write a program to determine the approximate probability of drawing certain balls randomly from a hat.
You can access <a href='https://repl.it/@freeCodeCamp/fcc-probability-calculator' target='_blank'>the full project description and starter code on repl.it</a>. After going to that link, fork the project. Once you complete the project based on the instructions in 'README.md', submit your project link below. You can access <a href='https://repl.it/@freeCodeCamp/fcc-probability-calculator' target='_blank'>the full project description and starter code on Repl.it</a>. After going to that link, fork the project. Once you complete the project based on the instructions in 'README.md', submit your project link below.
We are still developing the interactive instructional part of the Python curriculum. For now, here are some videos on the freeCodeCamp.org YouTube channel that will teach you everything you need to know to complete this project: We are still developing the interactive instructional part of the Python curriculum. For now, here are some videos on the freeCodeCamp.org YouTube channel that will teach you everything you need to know to complete this project:
<ul> <ul>

2
curriculum/challenges/english/07-scientific-computing-with-python/scientific-computing-with-python-projects/time-calculator.english.md
View File

@ -10,7 +10,7 @@ isRequired: true
<section id='description'> <section id='description'>
Write a function named "add_time" that can add a duration to a start time and return the result. Write a function named "add_time" that can add a duration to a start time and return the result.
You can access <a href='https://repl.it/@freeCodeCamp/fcc-time-calculator' target='_blank'>the full project description and starter code on repl.it</a>. After going to that link, fork the project. Once you complete the project based on the instructions in 'README.md', submit your project link below. You can access <a href='https://repl.it/@freeCodeCamp/fcc-time-calculator' target='_blank'>the full project description and starter code on Repl.it</a>. After going to that link, fork the project. Once you complete the project based on the instructions in 'README.md', submit your project link below.
We are still developing the interactive instructional part of the Python curriculum. For now, here are some videos on the freeCodeCamp.org YouTube channel that will teach you everything you need to know to complete this project: We are still developing the interactive instructional part of the Python curriculum. For now, here are some videos on the freeCodeCamp.org YouTube channel that will teach you everything you need to know to complete this project:
<ul> <ul>

2
curriculum/challenges/english/08-data-analysis-with-python/data-analysis-with-python-projects/demographic-data-analyzer.english.md
View File

@ -10,7 +10,7 @@ isRequired: true
<section id='description'> <section id='description'>
In this challenge you must analyze demographic data using Pandas. You are given a dataset of demographic data that was extracted from the 1994 Census database. In this challenge you must analyze demographic data using Pandas. You are given a dataset of demographic data that was extracted from the 1994 Census database.
You can access <a href='https://repl.it/@freeCodeCamp/fcc-demographic-data-analyzer' target='_blank'>the full project description and starter code on repl.it</a>. You can access <a href='https://repl.it/@freeCodeCamp/fcc-demographic-data-analyzer' target='_blank'>the full project description and starter code on Repl.it</a>.
After going to that link, fork the project. Once you complete the project based on the instructions in 'README.md', submit your project link below. After going to that link, fork the project. Once you complete the project based on the instructions in 'README.md', submit your project link below.

2
curriculum/challenges/english/08-data-analysis-with-python/data-analysis-with-python-projects/mean-variance-standard-deviation-calculator.english.md
View File

@ -10,7 +10,7 @@ isRequired: true
<section id='description'> <section id='description'>
Create a function that uses Numpy to output the mean, variance, and standard deviation of the rows, columns, and elements in a 3 x 3 matrix. Create a function that uses Numpy to output the mean, variance, and standard deviation of the rows, columns, and elements in a 3 x 3 matrix.
You can access <a href='https://repl.it/@freeCodeCamp/fcc-mean-var-std' target='_blank'>the full project description and starter code on repl.it</a>. You can access <a href='https://repl.it/@freeCodeCamp/fcc-mean-var-std' target='_blank'>the full project description and starter code on Repl.it</a>.
After going to that link, fork the project. Once you complete the project based on the instructions in 'README.md', submit your project link below. After going to that link, fork the project. Once you complete the project based on the instructions in 'README.md', submit your project link below.

2
curriculum/challenges/english/08-data-analysis-with-python/data-analysis-with-python-projects/medical-data-visualizer.english.md
View File

@ -10,7 +10,7 @@ isRequired: true
<section id='description'> <section id='description'>
In this project, you will visualize and make calculations from medical examination data using matplotlib, seaborn, and pandas. In this project, you will visualize and make calculations from medical examination data using matplotlib, seaborn, and pandas.
You can access <a href='https://repl.it/@freeCodeCamp/fcc-medical-data-visualizer' target='_blank'>the full project description and starter code on repl.it</a>. You can access <a href='https://repl.it/@freeCodeCamp/fcc-medical-data-visualizer' target='_blank'>the full project description and starter code on Repl.it</a>.
After going to that link, fork the project. Once you complete the project based on the instructions in 'README.md', submit your project link below. After going to that link, fork the project. Once you complete the project based on the instructions in 'README.md', submit your project link below.

2
curriculum/challenges/english/08-data-analysis-with-python/data-analysis-with-python-projects/page-view-time-series-visualizer.english.md
View File

@ -10,7 +10,7 @@ isRequired: true
<section id='description'> <section id='description'>
For this project you will visualize time series data using a line chart, bar chart, and box plots. You will use Pandas, matplotlib, and seaborn to visualize a dataset containing the number of page views each day on the freeCodeCamp.org forum from 2016-05-09 to 2019-12-03. The data visualizations will help you understand the patterns in visits and identify yearly and monthly growth. For this project you will visualize time series data using a line chart, bar chart, and box plots. You will use Pandas, matplotlib, and seaborn to visualize a dataset containing the number of page views each day on the freeCodeCamp.org forum from 2016-05-09 to 2019-12-03. The data visualizations will help you understand the patterns in visits and identify yearly and monthly growth.
You can access <a href='https://repl.it/@freeCodeCamp/fcc-time-series-visualizer' target='_blank'>the full project description and starter code on repl.it</a>. You can access <a href='https://repl.it/@freeCodeCamp/fcc-time-series-visualizer' target='_blank'>the full project description and starter code on Repl.it</a>.
After going to that link, fork the project. Once you complete the project based on the instructions in 'README.md', submit your project link below. After going to that link, fork the project. Once you complete the project based on the instructions in 'README.md', submit your project link below.

2
curriculum/challenges/english/08-data-analysis-with-python/data-analysis-with-python-projects/sea-level-predictor.english.md
View File

@ -10,7 +10,7 @@ isRequired: true
<section id='description'> <section id='description'>
In this project, you will analyze a dataset of the global average sea level change since 1880. You will use the data to predict the sea level change through year 2050. In this project, you will analyze a dataset of the global average sea level change since 1880. You will use the data to predict the sea level change through year 2050.
You can access <a href='https://repl.it/@freeCodeCamp/fcc-sea-level-predictor' target='_blank'>the full project description and starter code on repl.it</a>. You can access <a href='https://repl.it/@freeCodeCamp/fcc-sea-level-predictor' target='_blank'>the full project description and starter code on Repl.it</a>.
After going to that link, fork the project. Once you complete the project based on the instructions in 'README.md', submit your project link below. After going to that link, fork the project. Once you complete the project based on the instructions in 'README.md', submit your project link below.

6
curriculum/challenges/english/09-information-security/information-security-projects/anonymous-message-board.english.md
View File

@ -9,9 +9,9 @@ forumTopicId: 301568
## Description ## Description
<section id='description'> <section id='description'>
Build a full stack JavaScript app that is functionally similar to this: <a href='https://spiky-well-vein.glitch.me/' target='_blank'>https://spiky-well-vein.glitch.me/</a>. Build a full stack JavaScript app that is functionally similar to this: <a href="https://anonymous-message-board--freecodecamp.repl.co/" target="_blank">https://anonymous-message-board--freecodecamp.repl.co/</a>.
Working on this project will involve you writing your code on Glitch on our starter project. After completing this project you can copy your public glitch url (to the homepage of your app) into this screen to test it! Optionally you may choose to write your project on another platform but it must be publicly visible for our testing. Working on this project will involve you writing your code on Repl.it on our starter project. After completing this project you can copy your public Repl.it URL (to the homepage of your app) into this screen to test it! Optionally you may choose to write your project on another platform but it must be publicly visible for our testing.
Start this project on Glitch using <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-project-messageboard/'>this link</a> or clone <a href='https://github.com/freeCodeCamp/boilerplate-project-messageboard/'>this repository</a> on GitHub! If you use Glitch, remember to save the link to your project somewhere safe! Start this project on Repl.it using <a href="https://repl.it/github/freeCodeCamp/boilerplate-project-messageboard">this link</a> or clone <a href='https://github.com/freeCodeCamp/boilerplate-project-messageboard/'>this repository</a> on GitHub! If you use Repl.it, remember to save the link to your project somewhere safe!
</section> </section>
## Instructions ## Instructions

2
curriculum/challenges/english/09-information-security/information-security-projects/port-scanner.english.md
View File

@ -10,7 +10,7 @@ isRequired: true
<section id='description'> <section id='description'>
Create a port scanner using Python. Create a port scanner using Python.
You can access <a href='https://repl.it/@freeCodeCamp/fcc-port-scanner' target='_blank'>the full project description and starter code on repl.it</a>. You can access <a href='https://repl.it/@freeCodeCamp/fcc-port-scanner' target='_blank'>the full project description and starter code on Repl.it</a>.
After going to that link, fork the project. Once you complete the project based on the instructions in 'README.md', submit your project link below. After going to that link, fork the project. Once you complete the project based on the instructions in 'README.md', submit your project link below.

6
curriculum/challenges/english/09-information-security/information-security-projects/secure-real-time-multiplayer-game.english.md
View File

@ -8,11 +8,11 @@ isRequired: true
## Description ## Description
<section id='description'> <section id='description'>
Develop a 2D real time multiplayer game using the HTML Canvas API and <a href='https://socket.io/' target='_blank'>Socket.io</a> that is functionally similar to this: <a href='https://thread-valley-lipstick.glitch.me/' target='_blank'>https://thread-valley-lipstick.glitch.me/</a>. Develop a 2D real time multiplayer game using the HTML Canvas API and <a href='https://socket.io/' target='_blank'>Socket.io</a> that is functionally similar to this: <a href="https://secure-real-time-multiplayer-game--freecodecamp.repl.co/" target="_blank">https://secure-real-time-multiplayer-game--freecodecamp.repl.co/</a>.
Working on this project will involve you writing your code on Glitch on our starter project. After completing this project you can copy your public glitch url (to the homepage of your app) into this screen to test it! Optionally you may choose to write your project on another platform but it must be publicly visible for our testing. Working on this project will involve you writing your code on Repl.it on our starter project. After completing this project you can copy your public Repl.it URL (to the homepage of your app) into this screen to test it! Optionally you may choose to write your project on another platform but it must be publicly visible for our testing.
Start this project on Glitch using <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-project-secure-real-time-multiplayer-game/'>this link</a> or clone <a href='https://github.com/freeCodeCamp/boilerplate-project-secure-real-time-multiplayer-game'>this repository</a> on GitHub! If you use Glitch, remember to save the link to your project somewhere safe! Start this project on Repl.it using <a href="https://repl.it/github/freeCodeCamp/boilerplate-project-secure-real-time-multiplayer-game">this link</a> or clone <a href='https://github.com/freeCodeCamp/boilerplate-project-secure-real-time-multiplayer-game'>this repository</a> on GitHub! If you use Repl.it, remember to save the link to your project somewhere safe!
</section> </section>
## Instructions ## Instructions

2
curriculum/challenges/english/09-information-security/information-security-projects/sha-1-password-cracker.english.md
View File

@ -10,7 +10,7 @@ isRequired: true
<section id='description'> <section id='description'>
For this project you will learn about the importance of good security by creating a password cracker to figure out passwords that were hashed using SHA-1. For this project you will learn about the importance of good security by creating a password cracker to figure out passwords that were hashed using SHA-1.
You can access <a href='https://repl.it/@freeCodeCamp/fcc-brute-force-password-cracker' target='_blank'>the full project description and starter code on repl.it</a>. You can access <a href='https://repl.it/@freeCodeCamp/fcc-brute-force-password-cracker' target='_blank'>the full project description and starter code on Repl.it</a>.
After going to that link, fork the project. Once you complete the project based on the instructions in 'README.md', submit your project link below. After going to that link, fork the project. Once you complete the project based on the instructions in 'README.md', submit your project link below.

10
curriculum/challenges/english/09-information-security/information-security-projects/stock-price-checker.english.md
View File

@ -9,10 +9,10 @@ forumTopicId: 301572
## Description ## Description
<section id='description'> <section id='description'>
Build a full stack JavaScript app that is functionally similar to this: <a href='https://sphenoid-crater.glitch.me/' target='_blank'>https://sphenoid-crater.glitch.me/</a>. Build a full stack JavaScript app that is functionally similar to this: <a href="https://stock-price-checker--freecodecamp.repl.co/" target="_blank">https://stock-price-checker--freecodecamp.repl.co/</a>.
Since all reliable stock price APIs require an API key, we've built a workaround. Use <a href='https://repeated-alpaca.glitch.me/' target='_blank'>https://repeated-alpaca.glitch.me/</a> to get up-to-date stock price information without needing to sign up for your own key. Since all reliable stock price APIs require an API key, we've built a workaround. Use <a href="https://stock-price-checker-proxy--freecodecamp.repl.co" target="_blank">https://stock-price-checker-proxy--freecodecamp.repl.co</a> to get up-to-date stock price information without needing to sign up for your own key.
Working on this project will involve you writing your code on Glitch on our starter project. After completing this project you can copy your public glitch url (to the homepage of your app) into this screen to test it! Optionally you may choose to write your project on another platform but must be publicly visible for our testing. Working on this project will involve you writing your code on Repl.it on our starter project. After completing this project you can copy your public Repl.it URL (to the homepage of your app) into this screen to test it! Optionally you may choose to write your project on another platform but must be publicly visible for our testing.
Start this project on Glitch using <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-project-stockchecker/'>this link</a> or clone <a href='https://github.com/freeCodeCamp/boilerplate-project-stockchecker/'>this repository</a> on GitHub! If you use Glitch, remember to save the link to your project somewhere safe! Start this project on Repl.it using <a href="https://repl.it/github/freeCodeCamp/boilerplate-project-stockchecker">this link</a> or clone <a href='https://github.com/freeCodeCamp/boilerplate-project-stockchecker/'>this repository</a> on GitHub! If you use Repl.it, remember to save the link to your project somewhere safe!
</section> </section>
## Instructions ## Instructions
@ -35,7 +35,7 @@ tests:
testString: '' testString: ''
- text: If I pass along 2 stocks, the return object will be an array with information about both stocks. Instead of likes, it will display rel_likes (the difference between the likes on both stocks) on both. - text: If I pass along 2 stocks, the return object will be an array with information about both stocks. Instead of likes, it will display rel_likes (the difference between the likes on both stocks) on both.
testString: '' testString: ''
- text: 'A good way to receive current prices is through our stock price proxy (replacing ''GOOG'' with your stock symbol): https://repeated-alpaca.glitch.me/v1/stock/GOOG/quote' - text: 'A good way to receive current prices is through our stock price proxy (replacing ''GOOG'' with your stock symbol): https://stock-price-checker-proxy--freecodecamp.repl.co/v1/stock/GOOG/quote'
testString: '' testString: ''
- text: All 5 functional tests are complete and passing. - text: All 5 functional tests are complete and passing.
testString: '' testString: ''

4
curriculum/challenges/english/09-information-security/information-security-with-helmetjs/ask-browsers-to-access-your-site-via-https-only-with-helmet.hsts.english.md
View File

@ -8,13 +8,13 @@ forumTopicId: 301573
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-infosec/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-infosec/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-infosec">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-infosec/'>GitHub</a>.
HTTP Strict Transport Security (HSTS) is a web security policy which helps to protect websites against protocol downgrade attacks and cookie hijacking. If your website can be accessed via HTTPS you can ask user’s browsers to avoid using insecure HTTP. By setting the header Strict-Transport-Security, you tell the browsers to use HTTPS for the future requests in a specified amount of time. This will work for the requests coming after the initial request. HTTP Strict Transport Security (HSTS) is a web security policy which helps to protect websites against protocol downgrade attacks and cookie hijacking. If your website can be accessed via HTTPS you can ask user’s browsers to avoid using insecure HTTP. By setting the header Strict-Transport-Security, you tell the browsers to use HTTPS for the future requests in a specified amount of time. This will work for the requests coming after the initial request.
</section> </section>
## Instructions ## Instructions
<section id='instructions'> <section id='instructions'>
Configure <code>helmet.hsts()</code> to use HTTPS for the next 90 days. Pass the config object <code>{maxAge: timeInSeconds, force: true}</code>. Glitch already has hsts enabled. To override its settings you need to set the field "force" to true in the config object. We will intercept and restore the Glitch header, after inspecting it for testing. Configure <code>helmet.hsts()</code> to use HTTPS for the next 90 days. Pass the config object <code>{maxAge: timeInSeconds, force: true}</code>. Repl.it already has hsts enabled. To override its settings you need to set the field "force" to true in the config object. We will intercept and restore the Repl.it header, after inspecting it for testing.
Note: Configuring HTTPS on a custom website requires the acquisition of a domain, and a SSL/TSL Certificate. Note: Configuring HTTPS on a custom website requires the acquisition of a domain, and a SSL/TSL Certificate.
</section> </section>

2
curriculum/challenges/english/09-information-security/information-security-with-helmetjs/avoid-inferring-the-response-mime-type-with-helmet.nosniff.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301574
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-infosec/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-infosec/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-infosec">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-infosec/'>GitHub</a>.
Browsers can use content or MIME sniffing to adapt to different datatypes coming from a response. They override the Content-Type headers to guess and process the data. While this can be convenient in some scenarios, it can also lead to some dangerous attacks. This middleware sets the X-Content-Type-Options header to nosniff. This instructs the browser to not bypass the provided Content-Type. Browsers can use content or MIME sniffing to adapt to different datatypes coming from a response. They override the Content-Type headers to guess and process the data. While this can be convenient in some scenarios, it can also lead to some dangerous attacks. This middleware sets the X-Content-Type-Options header to nosniff. This instructs the browser to not bypass the provided Content-Type.
</section> </section>

2
curriculum/challenges/english/09-information-security/information-security-with-helmetjs/configure-helmet-using-the-parent-helmet-middleware.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301575
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-infosec/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-infosec/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-infosec">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-infosec/'>GitHub</a>.
<code>app.use(helmet())</code> will automatically include all the middleware introduced above, except <code>noCache()</code>, and <code>contentSecurityPolicy()</code>, but these can be enabled if necessary. You can also disable or configure any other middleware individually, using a configuration object. <code>app.use(helmet())</code> will automatically include all the middleware introduced above, except <code>noCache()</code>, and <code>contentSecurityPolicy()</code>, but these can be enabled if necessary. You can also disable or configure any other middleware individually, using a configuration object.
<h3>Example:</h3> <h3>Example:</h3>

2
curriculum/challenges/english/09-information-security/information-security-with-helmetjs/disable-client-side-caching-with-helmet.nocache.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301576
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-infosec/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-infosec/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-infosec">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-infosec/'>GitHub</a>.
If you are releasing an update for your website, and you want the users to always download the newer version, you can (try to) disable caching on client’s browser. It can be useful in development too. Caching has performance benefits, which you will lose, so only use this option when there is a real need. If you are releasing an update for your website, and you want the users to always download the newer version, you can (try to) disable caching on client’s browser. It can be useful in development too. Caching has performance benefits, which you will lose, so only use this option when there is a real need.
</section> </section>

2
curriculum/challenges/english/09-information-security/information-security-with-helmetjs/disable-dns-prefetching-with-helmet.dnsprefetchcontrol.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301577
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-infosec/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-infosec/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-infosec">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-infosec/'>GitHub</a>.
To improve performance, most browsers prefetch DNS records for the links in a page. In that way the destination ip is already known when the user clicks on a link. This may lead to over-use of the DNS service (if you own a big website, visited by millions people…), privacy issues (one eavesdropper could infer that you are on a certain page), or page statistics alteration (some links may appear visited even if they are not). If you have high security needs you can disable DNS prefetching, at the cost of a performance penalty. To improve performance, most browsers prefetch DNS records for the links in a page. In that way the destination ip is already known when the user clicks on a link. This may lead to over-use of the DNS service (if you own a big website, visited by millions people…), privacy issues (one eavesdropper could infer that you are on a certain page), or page statistics alteration (some links may appear visited even if they are not). If you have high security needs you can disable DNS prefetching, at the cost of a performance penalty.
</section> </section>

2
curriculum/challenges/english/09-information-security/information-security-with-helmetjs/hash-and-compare-passwords-asynchronously.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301578
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-bcrypt/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-bcrypt/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-bcrypt">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-bcrypt/'>GitHub</a>.
As hashing is designed to be computationally intensive, it is recommended to do so asynchronously on your server as to avoid blocking incoming connections while you hash. All you have to do to hash a password asynchronous is call As hashing is designed to be computationally intensive, it is recommended to do so asynchronously on your server as to avoid blocking incoming connections while you hash. All you have to do to hash a password asynchronous is call
```js ```js

2
curriculum/challenges/english/09-information-security/information-security-with-helmetjs/hash-and-compare-passwords-synchronously.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301579
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-bcrypt/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-bcrypt/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-bcrypt">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-bcrypt/'>GitHub</a>.
Hashing synchronously is just as easy to do but can cause lag if using it server side with a high cost or with hashing done very often. Hashing with this method is as easy as calling Hashing synchronously is just as easy to do but can cause lag if using it server side with a high cost or with hashing done very often. Hashing with this method is as easy as calling
```js ```js

2
curriculum/challenges/english/09-information-security/information-security-with-helmetjs/hide-potentially-dangerous-information-using-helmet.hidepoweredby.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301580
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-infosec/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-infosec/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-infosec">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-infosec/'>GitHub</a>.
Hackers can exploit known vulnerabilities in Express/Node if they see that your site is powered by Express. X-Powered-By: Express is sent in every request coming from Express by default. The <code>helmet.hidePoweredBy()</code> middleware will remove the X-Powered-By header. You can also explicitly set the header to something else, to throw people off. e.g. <code>app.use(helmet.hidePoweredBy({ setTo: 'PHP 4.2.0' }))</code> Hackers can exploit known vulnerabilities in Express/Node if they see that your site is powered by Express. X-Powered-By: Express is sent in every request coming from Express by default. The <code>helmet.hidePoweredBy()</code> middleware will remove the X-Powered-By header. You can also explicitly set the header to something else, to throw people off. e.g. <code>app.use(helmet.hidePoweredBy({ setTo: 'PHP 4.2.0' }))</code>
</section> </section>

2
curriculum/challenges/english/09-information-security/information-security-with-helmetjs/install-and-require-helmet.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301581
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-infosec/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-infosec/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-infosec">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-infosec/'>GitHub</a>.
Helmet helps you secure your Express apps by setting various HTTP headers. Helmet helps you secure your Express apps by setting various HTTP headers.
</section> </section>

2
curriculum/challenges/english/09-information-security/information-security-with-helmetjs/mitigate-the-risk-of-clickjacking-with-helmet.frameguard.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301582
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-infosec/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-infosec/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-infosec">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-infosec/'>GitHub</a>.
Your page could be put in a <code>&lt;frame&gt;</code> or <code>&lt;iframe&gt;</code> without your consent. This can result in clickjacking attacks, among other things. Clickjacking is a technique of tricking a user into interacting with a page different from what the user thinks it is. This can be obtained executing your page in a malicious context, by mean of iframing. In that context a hacker can put a hidden layer over your page. Hidden buttons can be used to run bad scripts. This middleware sets the X-Frame-Options header. It restricts who can put your site in a frame. It has three modes: DENY, SAMEORIGIN, and ALLOW-FROM. Your page could be put in a <code>&lt;frame&gt;</code> or <code>&lt;iframe&gt;</code> without your consent. This can result in clickjacking attacks, among other things. Clickjacking is a technique of tricking a user into interacting with a page different from what the user thinks it is. This can be obtained executing your page in a malicious context, by mean of iframing. In that context a hacker can put a hidden layer over your page. Hidden buttons can be used to run bad scripts. This middleware sets the X-Frame-Options header. It restricts who can put your site in a frame. It has three modes: DENY, SAMEORIGIN, and ALLOW-FROM.
We don’t need our app to be framed. We don’t need our app to be framed.
</section> </section>

2
curriculum/challenges/english/09-information-security/information-security-with-helmetjs/mitigate-the-risk-of-cross-site-scripting-xss-attacks-with-helmet.xssfilter.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301583
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-infosec/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-infosec/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-infosec">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-infosec/'>GitHub</a>.
Cross-site scripting (XSS) is a frequent type of attack where malicious scripts are injected into vulnerable pages, with the purpose of stealing sensitive data like session cookies, or passwords. Cross-site scripting (XSS) is a frequent type of attack where malicious scripts are injected into vulnerable pages, with the purpose of stealing sensitive data like session cookies, or passwords.
The basic rule to lower the risk of an XSS attack is simple: “Never trust user’s input”. As a developer you should always sanitize all the input coming from the outside. This includes data coming from forms, GET query urls, and even from POST bodies. Sanitizing means that you should find and encode the characters that may be dangerous e.g. <, >. The basic rule to lower the risk of an XSS attack is simple: “Never trust user’s input”. As a developer you should always sanitize all the input coming from the outside. This includes data coming from forms, GET query urls, and even from POST bodies. Sanitizing means that you should find and encode the characters that may be dangerous e.g. <, >.
Modern browsers can help mitigating the risk by adopting better software strategies. Often these are configurable via http headers. Modern browsers can help mitigating the risk by adopting better software strategies. Often these are configurable via http headers.

2
curriculum/challenges/english/09-information-security/information-security-with-helmetjs/prevent-ie-from-opening-untrusted-html-with-helmet.ienoopen.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301584
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-infosec/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-infosec/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-infosec">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-infosec/'>GitHub</a>.
Some web applications will serve untrusted HTML for download. Some versions of Internet Explorer by default open those HTML files in the context of your site. This means that an untrusted HTML page could start doing bad things in the context of your pages. This middleware sets the X-Download-Options header to noopen. This will prevent IE users from executing downloads in the trusted site’s context. Some web applications will serve untrusted HTML for download. Some versions of Internet Explorer by default open those HTML files in the context of your site. This means that an untrusted HTML page could start doing bad things in the context of your pages. This middleware sets the X-Download-Options header to noopen. This will prevent IE users from executing downloads in the trusted site’s context.
</section> </section>

2
curriculum/challenges/english/09-information-security/information-security-with-helmetjs/set-a-content-security-policy-with-helmet.contentsecuritypolicy.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301585
## Description ## Description
<section id='description'> <section id='description'>
As a reminder, this project is being built upon the following starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-infosec/'>Glitch</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-infosec/'>GitHub</a>. As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-infosec">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-infosec/'>GitHub</a>.
This challenge highlights one promising new defense that can significantly reduce the risk and impact of many type of attacks in modern browsers. By setting and configuring a Content Security Policy you can prevent the injection of anything unintended into your page. This will protect your app from XSS vulnerabilities, undesired tracking, malicious frames, and much more. CSP works by defining a whitelist of content sources which are trusted. You can configure them for each kind of resource a web page may need (scripts, stylesheets, fonts, frames, media, and so on…). There are multiple directives available, so a website owner can have a granular control. See HTML 5 Rocks, KeyCDN for more details. Unfortunately CSP is unsupported by older browser. This challenge highlights one promising new defense that can significantly reduce the risk and impact of many type of attacks in modern browsers. By setting and configuring a Content Security Policy you can prevent the injection of anything unintended into your page. This will protect your app from XSS vulnerabilities, undesired tracking, malicious frames, and much more. CSP works by defining a whitelist of content sources which are trusted. You can configure them for each kind of resource a web page may need (scripts, stylesheets, fonts, frames, media, and so on…). There are multiple directives available, so a website owner can have a granular control. See HTML 5 Rocks, KeyCDN for more details. Unfortunately CSP is unsupported by older browser.
By default, directives are wide open, so it’s important to set the defaultSrc directive as a fallback. Helmet supports both defaultSrc and default-src naming styles. The fallback applies for most of the unspecified directives. By default, directives are wide open, so it’s important to set the defaultSrc directive as a fallback. Helmet supports both defaultSrc and default-src naming styles. The fallback applies for most of the unspecified directives.
</section> </section>

2
curriculum/challenges/english/09-information-security/information-security-with-helmetjs/understand-bcrypt-hashes.english.md
View File

@ -8,7 +8,7 @@ forumTopicId: 301586
## Description ## Description
<section id='description'> <section id='description'>
For the following challenges, you will be working with a new starter project that is different from the previous one. You can find the new starter project on <a href='https://glitch.com/edit/#!/remix/clone-from-repo?REPO_URL=https://github.com/freeCodeCamp/boilerplate-bcrypt/'>Glitch</a>, or clone it from <a href='https://github.com/freeCodeCamp/boilerplate-bcrypt/'>GitHub</a>. For the following challenges, you will be working with a new starter project that is different from the previous one. You can find the new starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-bcrypt">Repl.it</a>, or clone it from <a href='https://github.com/freeCodeCamp/boilerplate-bcrypt/'>GitHub</a>.
BCrypt hashes are very secure. A hash is basically a fingerprint of the original data- always unique. This is accomplished by feeding the original data into an algorithm and returning a fixed length result. To further complicate this process and make it more secure, you can also <em>salt</em> your hash. Salting your hash involves adding random data to the original data before the hashing process which makes it even harder to crack the hash. BCrypt hashes are very secure. A hash is basically a fingerprint of the original data- always unique. This is accomplished by feeding the original data into an algorithm and returning a fixed length result. To further complicate this process and make it more secure, you can also <em>salt</em> your hash. Salting your hash involves adding random data to the original data before the hashing process which makes it even harder to crack the hash.
BCrypt hashes will always looks like <code>$2a$13$ZyprE5MRw2Q3WpNOGZWGbeG7ADUre1Q8QO.uUUtcbqloU0yvzavOm</code> which does have a structure. The first small bit of data <code>$2a</code> is defining what kind of hash algorithm was used. The next portion <code>$13</code> defines the <em>cost</em>. Cost is about how much power it takes to compute the hash. It is on a logarithmic scale of 2^cost and determines how many times the data is put through the hashing algorithm. For example, at a cost of 10 you are able to hash 10 passwords a second on an average computer, however at a cost of 15 it takes 3 seconds per hash... and to take it further, at a cost of 31 it would takes multiple days to complete a hash. A cost of 12 is considered very secure at this time. The last portion of your hash <code>$ZyprE5MRw2Q3WpNOGZWGbeG7ADUre1Q8QO.uUUtcbqloU0yvzavOm</code>, looks like one large string of numbers, periods, and letters but it is actually two separate pieces of information. The first 22 characters is the salt in plain text, and the rest is the hashed password! BCrypt hashes will always looks like <code>$2a$13$ZyprE5MRw2Q3WpNOGZWGbeG7ADUre1Q8QO.uUUtcbqloU0yvzavOm</code> which does have a structure. The first small bit of data <code>$2a</code> is defining what kind of hash algorithm was used. The next portion <code>$13</code> defines the <em>cost</em>. Cost is about how much power it takes to compute the hash. It is on a logarithmic scale of 2^cost and determines how many times the data is put through the hashing algorithm. For example, at a cost of 10 you are able to hash 10 passwords a second on an average computer, however at a cost of 15 it takes 3 seconds per hash... and to take it further, at a cost of 31 it would takes multiple days to complete a hash. A cost of 12 is considered very secure at this time. The last portion of your hash <code>$ZyprE5MRw2Q3WpNOGZWGbeG7ADUre1Q8QO.uUUtcbqloU0yvzavOm</code>, looks like one large string of numbers, periods, and letters but it is actually two separate pieces of information. The first 22 characters is the salt in plain text, and the rest is the hashed password!
</section> </section>