freecodecamp / learn Goto Github PK
View Code? Open in Web Editor NEWfreeCodeCamp's learning platform with 2,000 interactive coding challenges
Home Page: https://learn.freecodecamp.org
License: BSD 3-Clause "New" or "Revised" License
freeCodeCamp's learning platform with 2,000 interactive coding challenges
Home Page: https://learn.freecodecamp.org
License: BSD 3-Clause "New" or "Revised" License
The theme to be used on the monaco editor should be light one on the light version of learn
Challenge Name
Affects all the HTML and CSS lessons
Browser Information
Browser Name, Version:
Firefox Quantum 60.0.1 (64-bit)
Chrome: Version 66.0.3359.117 (64-bit)
Operating System: Windows 10 Pro 64-bit
Mobile, Desktop, or Tablet: Dell Latitude Laptop (15")
Issue Description
The lesson(s) load with an empty preview area, the content appears once code starts to be entered into the editor. I am not certain if this is intentional but reporting it anyway.
Files to touch include:
./gatsby-node.js
./templates/Introduction/Intro.js
completion-epic.js
The test suite on projects is not working. Projects pass no matter what. This seems to apply to all projects.
In the example below, I should not have passed by entering 'http://freecodecamp.org'.
Challenge Name
https://learn.freecodecamp.org/responsive-web-design/basic-html-and-html5/link-to-internal-sections-of-a-page-with-anchor-elements
Issue Description
The test results in the preview pane are showing as all passed but the code is incorrect. The editor console is showing the correct information.
Browser Information
Browser Name, Version:
Firefox Quantum 60.0.1 (64-bit)
Chrome: Version 66.0.3359.117 (64-bit)
Operating System: Windows 10 Pro 64-bit
Mobile, Desktop, or Tablet: Dell Latitude Laptop (15")
Not a challenge - main page issue
When accessing the map from the main page => Explore the lesson map (button) => expand several menu group items in the modal and it exceeds the modal size
The success message is what is displayed in the completion modal header, it defaults to 'Happy Coding!'.
Before we used a words.json
available here. This should be acceptable to use again.
Challenge Name
https://learn.freecodecamp.org/responsive-web-design/applied-visual-design/create-visual-balance-using-the-text-align-property
Issue Description
The test results are overlapping the preview area at the default pane size. The ❌ or ✔️ appear to be too large, making either:
Browser Information
Browser Name, Version:
Firefox Quantum 60.0.1 (64-bit)
Chrome: Version 66.0.3359.117 (64-bit)
Operating System: Windows 10 Pro 64-bit
Mobile, Desktop, or Tablet: Dell Latitude Laptop (15")
Reset editor to the challenge seed, can be found in state.challenge.files
The autocomplete intellisense on the monaco editor brings up a huge load of things that we do not want, its best we disable it.
Challenge Name
Not a challenge - main page issue
Issue Description
When selecting a lesson from the modal, it re-directs you to the challenge but the modal does not close automatically, you need to use the 'x' to close out the modal.
This happens from the map on the main page and also if you select the 'View the curriculum' button when on a lesson to view the map.
Browser Information
Browser Name, Version:
Firefox Quantum 60.0.1 (64-bit)
Chrome: Version 66.0.3359.117 (64-bit)
Operating System: Windows 10 Pro 64-bit
Mobile, Desktop, or Tablet: Dell Latitude Laptop (15")
Challenge Name(s)
jQuery - Target HTML Elements with Selectors Using jQuery
https://learn.freecodecamp.org/front-end-libraries/jquery/target-html-elements-with-selectors-using-jquery
then each lesson in jQuery following this one ..
it appears to be affecting the challenges as I can't pass any of them
Browser Information
Browser Name, Version:
Firefox Quantum 60.0.1 (64-bit)
Chrome: Version 66.0.3359.117 (64-bit)
Operating System: Windows 10 Pro 64-bit
Mobile, Desktop, or Tablet: Dell Latitude Laptop (15")
Issue Description:
The jQuery code is appearing in the preview pane on the right hand side. This occurs as of the Target HTML Elements with Selectors Using jQuery. I have tested a majority of the lessons and the lessons don't pass.
Some challenges link to a Glitch starter project. The link opens in the same window. It would be more user-freindly if the link opened in a new window/tab. Most people clicking on that link will want the fCC page to still be open so they can submit their project. This also applies to GitHub link.
Image of one page that has the link:
We do not want the minimap on the monaco editor.
Challenge Name
https://learn.freecodecamp.org/responsive-web-design/basic-html-and-html5/nest-an-anchor-element-within-a-paragraph
Issue Description
In the lesson text opens to freecodecamp.org website in the same tab. My suggestion is to have it open to a new tab so the camper does not lose lesson they are on.
Browser Information
Browser Name, Version:
Firefox Quantum 60.0.1 (64-bit)
Chrome: Version 66.0.3359.117 (64-bit)
Operating System: Windows 10 Pro 64-bit
Mobile, Desktop, or Tablet: Dell Latitude Laptop (15")
When I follow the step to step.
after I run the yarn develop
. I went to check browser. I checked the site. I got white page and an error in the console.
I didn't realize, I have to create env file. since set up the step to step didn't tell us, we need to do it before run yarn develop
more like we need to info them about it. as the user use learn repo first time.
about typo,
4. git branch -b <your-branch-name>
is typo.
i think correct info is 4. git checkout -b <your-branch-name>
@Bouncey, I saw Quincy announce this new web app over on Gitter. Can't wait to get it running and see how everything works!
However, when I run yarn develop
, I get the following error:
ERROR Failed to compile with 3 errors 16:22:30
These dependencies were not found:
* /home/kris/Documents/GitHub/forks/learn/.cache/json/javascript-algorithms-and-data-structures-object-oriented-programming-use-closure-to-protect-properties-within-an-object-from-being-modified-externally.json in ./.cache/sync-requires.js
* /home/kris/Documents/GitHub/forks/learn/.cache/json/javascript-algorithms-and-data-structures-functional-programming-use-the-every-method-to-check-that-every-element-in-an-array-meets-a-criteria.json in ./.cache/sync-requires.js
* /home/kris/Documents/GitHub/forks/learn/.cache/json/javascript-algorithms-and-data-structures-functional-programming-use-the-some-method-to-check-that-any-elements-in-an-array-meet-a-criteria.json in ./.cache/sync-requires.js
To install them, you can run: npm install --save /home/kris/Documents/GitHub/forks/learn/.cache/json/javascript-algorithms-and-data-structures-object-oriented-programming-use-closure-to-protect-properties-within-an-object-from-being-modified-externally.json /home/kris/Documents/GitHub/forks/learn/.cache/json/javascript-algorithms-and-data-structures-functional-programming-use-the-every-method-to-check-that-every-element-in-an-array-meets-a-criteria.json /home/kris/Documents/GitHub/forks/learn/.cache/json/javascript-algorithms-and-data-structures-functional-programming-use-the-some-method-to-check-that-any-elements-in-an-array-meet-a-criteria.json
When I try to run npm install --save ...
from the error message, I get an error from npm saying that the filename is too long. I believe it's because my home directory is encrypted, so filenames can only be ~143 characters.
Is there an easy way to work around this limitation? Maybe change the way that the files are saved in .cache/json? I tried poking around the codebase to find a way to get the files to save folders and create a longer path / shorten the actual filenames, but wasn't able to figure out how to do so.
This issue is not actually in the codebase but it is part of the curriculum. The Glitch starter project should have all references to 'HyperDev' changed to 'glitch'. @QuincyLarson may have to do this one and it may not be high priority.
yarn develop
was working fine for me until today when I did a rebase over master. After the rebase, I ran yarn install
which completed succesfully.
Now I'm getting this error when running yarn develop
:
info bootstrap finished - 21.409 s
error Class constructor DefinePlugin cannot be invoked without 'new'
TypeError: Class constructor DefinePlugin cannot be invoked without 'new'
- plugin.js:8 new F
[learn]/[webpack-configurator]/lib/resolve/plugin.js:8:33
- plugin.js:13
[learn]/[webpack-configurator]/lib/resolve/plugin.js:13:16
- plugin.js:14 module.exports
[learn]/[webpack-configurator]/lib/resolve/plugin.js:14:8
- index.js:180 Config.resolve
[learn]/[webpack-configurator]/index.js:180:22
- webpack-modify-validate.js:45 _callee$
[learn]/[gatsby]/src/utils/webpack-modify-validate.js:45:43
- next_tick.js:131 _combinedTickCallback
internal/process/next_tick.js:131:7
- next_tick.js:180 process._tickCallback
internal/process/next_tick.js:180:9
error Command failed with exit code 1.
v8.11.1
5.6.0
1.6.0
Ubuntu 16.04.4
Challenge Name
Not Challenge Specific - it originates from the curriculum map - section introduction pages
(eg: https://learn.freecodecamp.org/responsive-web-design/applied-visual-design )
Browser Information
Browser Name, Version:
Firefox Quantum 60.0.1 (64-bit)
Chrome: Version 66.0.3359.117 (64-bit)
Operating System: Windows 10 Pro 64-bit
Mobile, Desktop, or Tablet: Dell Latitude Laptop (15")
Issue Description:
From any challenge if :
Challenge Name
All Projects under Responsive Web Design
(i.e) https://learn.freecodecamp.org/responsive-web-design/responsive-web-design-projects/build-a-survey-form
Browser Information
Browser Name, Version:
Firefox Quantum 60.0.1 (64-bit)
Chrome: Version 66.0.3359.117 (64-bit)
Operating System: Windows 10 Pro 64-bit
Mobile, Desktop, or Tablet: Dell Latitude Laptop (15")
Issue Description:
CTRL + Enter is not working to mark the project as completed. The button is working as normal.
There is no error in the console when using the CTRL + Enter to mark project complete.
Challenge: "Basic HTML and HTML5 - Create a Set of Radio Buttons"
https://learn.freecodecamp.org/responsive-web-design/basic-html-and-html5/create-a-set-of-radio-buttons
Here is the relevant text in the description for this challenge:
Each of your radio buttons should be nested within its own label element. Wrapping an input element inside of a label element makes the label text clickable.
It is NOT necessary to wrap an input element inside of a label element to make the text clickable as long as there is a for
field on the label that matches the id
of the input. The recommendation on fCC is contrary to what is shown at MDN: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/radio
It works either way so this is not necessarily an error but I think it is best to change this to go along with MDN.
Challenge Name
https://learn.freecodecamp.org/responsive-web-design/basic-html-and-html5/link-to-external-pages-with-anchor-elements
Browser Information
Browser Name, Version:
Firefox Quantum 60.0.1 (64-bit)
Chrome: Version 66.0.3359.117 (64-bit)
Operating System: Windows 10 Pro 64-bit
Mobile, Desktop, or Tablet: Dell Latitude Laptop (15")
Issue Description
Right clicking into the editor to paste text from lesson, the menu items are hard to see as its green on dark grey
@raisedadead commented on Fri May 25 2018
@raisedadead commented on Fri May 25 2018
I think my last challenge before this was at HTML Uncomment Elements
@LBWright commented on Mon May 21 2018
Going through Beta with React and after going through a few of the classes, I'm receiving errors or the tests just aren't passing. The first error is f(...) undefined' in the stateless component section. The second of the errors is
Enzyme Internal Error: unknown composite type undefinedin the
Create a React Component` page.
This problem is reproduced by just providing the solution to the problem.
I've heard of these issues when the package.json and the Jest configuration don't match but I could also be completely wrong.
https://learn.freecodecamp.org/front-end-libraries/react/create-a-react-component
@LBWright commented on Mon May 21 2018
Coding Interview Prep:
And also add the Information Security and Quality Assurance certification back in.
Challenge Name
https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/es6/mutate-an-array-declared-with-const
Browser Information
Browser Name, Version:
Firefox Quantum 60.0.1 (64-bit)
Chrome: Version 66.0.3359.117 (64-bit)
Operating System: Windows 10 Pro 64-bit
Mobile, Desktop, or Tablet: Dell Latitude Laptop (15")
Issue Description:
The previous challenge ES6 - Declare a Read-Only Variable with the const Keyword enforces the const variable to be declared in all uppercase letters, where as the Mutate an Array Declared with const lesson does not, it accepts the const variable declared in lowercase letters.
Specifically, in the react-redux section, upon running tests on the challenges after I've finished the code (which I know 100% is correct from visiting previous solves and other forum posts) I am presented with the following issues:
"Cannot read property 'rendered' of undefined" (note that this one appears in the console window below the code editor and not the chrome console). After google searching this issue, I tried adding one line of code: " import ReactDOM from 'react-dom'; " and got error: 'require is not defined'
Not sure if these miscellaneous errors are relevant:
going to the home page of beta.fcc.org I get two errors:
vendor-main-eb0b5913eb.js:27
Uncaught TypeError: Cannot read property 'version' of undefined
at vendor-main-eb0b5913eb.js:27
at vendor-main-eb0b5913eb.js:27
at vendor-main-eb0b5913eb.js:27
and
main.js:1
Uncaught ReferenceError: require is not defined
at main.js:1
Upon trying to load any challenge page (before running any tests) I get the following error:
Uncaught (in promise) TypeError: Request scheme 'chrome-extension' is unsupported
at sw.js:279
Well sorry for the bad background information on this one... 😅
Unfortunately I don't have much information as I can't reproduce it.
This happened on the very first page load - all subsequent ones worked perfectly.
The Firefox v60.0.1 dev tools warned about 3 scripts that failed to load.
When I clicked the button to open curricullum on the landing page, it threw an error instead of opening the modal.
The error said something about JSONP - but unfortunately I hit the refresh-button instead of screenshot-button...
Thanks for the work on the learn-update though. Keep it up! 🙂
In prep for graphql api
Much like we moved the introduction challenges to markdown, see /responsive-web-design/basic-css
for an idea of what I am talking about, We would like to so the same to /superBlock
routes.
Step one is to stub the pages until we have a better idea as to what they will look like and how they will function.
/src/introductions
directory should have and index.md
file. The contents of this markdown file should be---
title: <Title of the superBlock (Title Case)>
superBlock: <Title of the superBlock (Title Case)>
---
This is a stub introduction for <Title of the superBlock (Title Case)>
In /src/utils/gatsby
, the createIntroPages
function will need to be changed to check for the presence of block
in the values passed to it. If block
is falsey, we should create the page with a different component. This is the current Intro
component is not compatible with the what we have in the superBlock
stubs.
Create a SuperBlockIntro
component in /src/templates
, all we want it to do for now is render the html passed to it. See the Introduction
component to see how the graphql
query is structured and how the data is passed in as props.
Most importantly, have fun!
If you get stuck, reach out to us and ask all the questions! No question is a silly question if you don't know the answer.
After a fresh clone of this project and a successful yarn install
, I get the following error messages when running yarn develop
:
success delete html and css files from previous builds — 0.008 s
error We encountered an error while trying to load your site's gatsby-config.js. Please fix the error and try again.
Error: /home/tc/ws/learn/seed/buildChallenges.js:78
...file,
^^^
SyntaxError: Unexpected token ...
It wouldn't be too much work to have each intro page host a table of contents for the upcoming block.
Generation of these tables will be programmatic.
Thoughts @QuincyLarson
Challenge Name
https://learn.freecodecamp.org/responsive-web-design/basic-css/prioritize-one-style-over-another
Browser Information
Browser Name, Version:
Firefox Quantum 60.0.1 (64-bit)
Chrome: Version 66.0.3359.117 (64-bit)
Operating System: Windows 10 Pro 64-bit
Mobile, Desktop, or Tablet: Dell Latitude Laptop (15")
Issue Description
The assert tests show up in the preview pane while typing in the editor. It disappears once the complete needed code is written.
The message is actually quite long.. a small screenshot has been provided
We edit the webpack config though ./gatsby-node.js
, near the bottom of the file
Challenge Name
https://learn.freecodecamp.org/responsive-web-design/basic-html-and-html5/link-to-external-pages-with-anchor-elements
Browser Information
Browser Name, Version:
Firefox Quantum 60.0.1 (64-bit)
Chrome: Version 66.0.3359.117 (64-bit)
Operating System: Windows 10 Pro 64-bit
Mobile, Desktop, or Tablet: Dell Latitude Laptop (15")
Issue Description
The test results in the editor are logging special characters rather than the text those characters represent
The challenge titled "Introduction to the Managing Packages with npm Challenges" is in beta but not in learn. Many other introductory challenges are also missing. They are important because they introduce Glitch which is referred to in many other tasks.
Many tasks start with the line, "As a reminder, this project is being built upon the following starter project on Glitch, or cloned from GitHub." Without this missing task, we are reminding people of something we never told them.
See screenshot with learn and beta side-by-side. There are many more missing introductions not shown.
Challenge Name
https://learn.freecodecamp.org/responsive-web-design/basic-html-and-html5/say-hello-to-html-elements
Issue Description
There are several issues here (similar to the issue that already existed in Beta):
When shrinking and expanding the lesson pane => the editor size does not expand to the new pane size when expanding the lesson pane. No issue on expanding the lesson pane, adjusts accordingly
Shirking the editor window is fine, expanding has several issues
a) does not allow you to expand the editor window, this green highlighted bar shows up
b) to get the editor back, you need to re-size the lesson plan, then you can re-size the editor/preview pane
After attempting to expand the editor/preview pane which fails, if you move your cursor over the lesson pane ( no mouse button is clicked) the cusor changes to from arrow to expanding icon and it resizes the editor/preview pane and follows the mouse movement.
Browser Information
Browser Name, Version:
Firefox Quantum 60.0.1 (64-bit)
Chrome: Version 66.0.3359.117 (64-bit)
Operating System: Windows 10 Pro 64-bit
Mobile, Desktop, or Tablet: Dell Latitude Laptop (15")
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.