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

feat: Simplify production's onboarding (#15528)

Browse Source 
* simplify onboarding

* add hint button for all basic and algorithm challenges

* update onboarding and settings

* add chat room link to settings
This commit is contained in:
Quincy Larson
2017-06-27 17:55:50 -05:00
committed by Berkeley Martinez
parent b28d1b00db
commit 544f4b5de0
12 changed files with 149 additions and 1324 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
common/app/components/Nav/links.json
View File

@ -1,10 +1,6 @@
[{
"content": "Map",
"link": "/map"
}, {
"content": "Chat",
"link": "//gitter.im/FreeCodeCamp/FreeCodeCamp",
"target": "_blank"
},{
"content": "Forum",
"link": "http://forum.freecodecamp.com/",
@ -13,6 +9,6 @@
"content": "About",
"link": "/about"
},{
"content": "Shop",
"link": "/shop"
"content": "Donate",
"link": "/donate"
}]

1088
seed/challenges/00-getting-started/getting-started.json
View File

File diff suppressed because it is too large Load Diff

187
seed/challenges/01-front-end-development-certification/gear-up-for-success.json
View File

@ -1,103 +1,11 @@
{
"name": "Gear up for Success",
"order": 3,
"time": "20 minutes",
"time": "5 minutes",
"challenges": [
{
"id": "573c96eac9a6be092d7830c1",
"title": "Join our Forum",
"description": [
[
"//i.imgur.com/y0XxmxQ.gif",
"A gif showing how you can join Free Code Camp's forum by clicking the \"sign up\" button, authenticating using GitHub, and verifying your email address.",
"Our forum is the best place for deep discussions about various programming resources: books, online courses, coding events, and more. You can also get help with these resources from your fellow campers. Click the button below to open up our forum, then click the \"Sign up\" button. Once you've created an account using GitHub, you'll need to confirm your email address. Now you're able to join discussions on our forum!",
"http://forum.freecodecamp.com/"
],
[
"//i.imgur.com/GxCpl7x.gif",
"A gif showing how you can upload your profile picture.",
"We recommend that you also add a custom profile picture of your face. You can do this in the settings section of the forum.",
""
],
[
"//i.imgur.com/Gop2PmJ.gif",
"A gif showing how you can introduce yourself on our self introduction forum thread.",
"You can make your first forum post right now by clicking the button below to go to the introduction thread. You can reply to the original post with: who you are, why you're learning to code, and how you've been learning to code so far. Then feel free to explore the various discussions and jump in with your own thoughts.",
"https://forum.freecodecamp.com/t/welcome-to-freecodecamps-forum/92385"
]
],
"releasedOn": "May 17, 2016",
"challengeSeed": [],
"tests": [],
"type": "Waypoint",
"challengeType": 7,
"titleEs": "Join our Forum",
"descriptionEs": [
[
"//i.imgur.com/y0XxmxQ.gif",
"A gif showing how you can join Free Code Camp's forum by clicking the \"sign up\" button, authenticating using GitHub, and verifying your email address.",
"Our forum is the best place for deep discussions about various programming resources: books, online courses, coding events, and more. You can also get help with these resources from your fellow campers. Click the button below to open up our forum, then click the \"Sign up\" button. Once you've created an account using GitHub, you'll need to confirm your email address. Now you're able to join discussions on our forum!",
"http://forum.freecodecamp.com/"
],
[
"//i.imgur.com/GxCpl7x.gif",
"A gif showing how you can upload your profile picture.",
"We recommend that you also add a custom profile picture of your face. You can do this in the settings section of the forum.",
""
],
[
"//i.imgur.com/Gop2PmJ.gif",
"A gif showing how you can introduce yourself on our self introduction forum thread.",
"You can make your first forum post right now by clicking the button below to go to the introduction thread. You can reply to the original post with: who you are, why you're learning to code, and how you've been learning to code so far. Then feel free to explore the various discussions and jump in with your own thoughts.",
"https://forum.freecodecamp.com/t/welcome-to-freecodecamps-forum/92385"
]
],
"titleFr": "Join our Forum",
"descriptionFr": [
[
"//i.imgur.com/y0XxmxQ.gif",
"A gif showing how you can join Free Code Camp's forum by clicking the \"sign up\" button, authenticating using GitHub, and verifying your email address.",
"Our forum is the best place for deep discussions about various programming resources: books, online courses, coding events, and more. You can also get help with these resources from your fellow campers. Click the button below to open up our forum, then click the \"Sign up\" button. Once you've created an account using GitHub, you'll need to confirm your email address. Now you're able to join discussions on our forum!",
"http://forum.freecodecamp.com/"
],
[
"//i.imgur.com/GxCpl7x.gif",
"A gif showing how you can upload your profile picture.",
"We recommend that you also add a custom profile picture of your face. You can do this in the settings section of the forum.",
""
],
[
"//i.imgur.com/Gop2PmJ.gif",
"A gif showing how you can introduce yourself on our self introduction forum thread.",
"You can make your first forum post right now by clicking the button below to go to the introduction thread. You can reply to the original post with: who you are, why you're learning to code, and how you've been learning to code so far. Then feel free to explore the various discussions and jump in with your own thoughts.",
"https://forum.freecodecamp.com/t/welcome-to-freecodecamps-forum/92385"
]
],
"titleDe": "Join our Forum",
"descriptionDe": [
[
"//i.imgur.com/y0XxmxQ.gif",
"A gif showing how you can join Free Code Camp's forum by clicking the \"sign up\" button, authenticating using GitHub, and verifying your email address.",
"Our forum is the best place for deep discussions about various programming resources: books, online courses, coding events, and more. You can also get help with these resources from your fellow campers. Click the button below to open up our forum, then click the \"Sign up\" button. Once you've created an account using GitHub, you'll need to confirm your email address. Now you're able to join discussions on our forum!",
"http://forum.freecodecamp.com/"
],
[
"//i.imgur.com/GxCpl7x.gif",
"A gif showing how you can upload your profile picture.",
"We recommend that you also add a custom profile picture of your face. You can do this in the settings section of the forum.",
""
],
[
"//i.imgur.com/Gop2PmJ.gif",
"A gif showing how you can introduce yourself on our self introduction forum thread.",
"You can make your first forum post right now by clicking the button below to go to the introduction thread. You can reply to the original post with: who you are, why you're learning to code, and how you've been learning to code so far. Then feel free to explore the various discussions and jump in with your own thoughts.",
"https://forum.freecodecamp.com/t/welcome-to-freecodecamps-forum/92385"
]
]
},
{
"id": "560add71cb82ac38a17513c2",
"title": "Join a Free Code Camp Group in Your City",
"title": "Join a freeCodeCamp Study Group in Your City",
"description": [
[
"//i.imgur.com/WBVydfk.jpg",
@ -107,8 +15,8 @@
],
[
"//i.imgur.com/IqBnnuFr.jpg",
"A picture of some of our campers meeting in a local cafe.",
"Find your local study group and click it. This will take you to its Facebook page. Click the \"Join group\" button. Someone from the group should approve you shortly.",
"A picture of our study group directory.",
"Click the button below to open our study group directory. <br><br>Find your local study group and click it. This will take you to their Facebook group. <br><br>Click the <bold>Join group</bold> button. Once someone from the group approves your join request, and you'll get a notification within Facebook, and can go back and introduce yourself.",
"https://www.freecodecamp.com/study-group-directory/"
]
],
@ -162,6 +70,50 @@
]
]
},
{
"id": "560ade65cb82ac38a17513c2",
"title": "Watch Coding Videos on the freeCodeCamp YouTube Channel",
"description": [
[
"//i.imgur.com/kA6uW8H.gif",
"A gif showing that you should click the \"subscribe\" button on freeCodeCamp YouTube channel, then click the bell icon, the notification confirmation box, then the \"Save\" button.",
"We publish new coding videos on YouTube every day. <br><br>Click the button below to open our YouTube channel. Then click the red <bold>subscribe</bold> button. Then click the <bold>bell</bold> that appears. Check the box in the message that pops up, then click <bold>save</bold>.",
"https://www.youtube.com/freecodecamp"
]
],
"releasedOn": "April 15, 2016",
"challengeSeed": [],
"tests": [],
"type": "Waypoint",
"challengeType": 7,
"titleEs": "Miranos programar en vivo por YouTube",
"descriptionEs": [
[
"//i.imgur.com/4jUhEsb.jpg",
"An image of Briana at the whiteboard teaching in a YouTube video.",
"Our community's YouTube channel features video tutorials and demos of projects that campers have built for nonprofits. We add new videos every week. The button below will take you to our YouTube channel, where you can subscribe for free.",
"https://www.youtube.com/channel/UC8butISFwT-Wl7EV0hUK0BQ?sub_confirmation=1"
]
],
"titleFr": "Regarde nous coder en direct sur Twitch.tv",
"descriptionFr": [
[
"//i.imgur.com/8rtyRY1.gif",
"Une gif montrant comment tu peux créer un compte sur Twitch.tv et suivre notre chaîne.",
"Nos campers codent fréquemment en direct sur Twitch.tv, un site de streaming populaire. Tu peux créer un compte en moins d’une minute, et suivre la chaîne de Free Code Camp. Une fois suivi, tu auras l’option de recevoir un email à chaque fois qu’un de nos campers est en direct. Et donc tu peux rejoindre plusieurs campers pour regarder et interagir sur le salon de chat. C’est une façon d’apprendre en regardant les autres coder.",
"https://twitch.tv/freecodecamp"
]
],
"titleDe": "Schaue uns auf Twitch.tv Live beim Programmieren zu",
"descriptionDe": [
[
"//i.imgur.com/8rtyRY1.gif",
"Ein GIF, das dir zeigt, wie du dich bei Twitch.tv anmelden und unserem Kanal folgen kannst.",
"Unsere Camper programmieren oft Live auf Twitch.tv, einer populären Streaming-Website. Du kannst in weniger als einer Minute einen Account anlegen und dann dem Kanal von Free Code Camp folgen. Wenn du dem Kanal folgst, hast du die Option E-Mail Benachrichtigungen zu bekommen, sobald einer unserer Camper live geht. Dann kannst du Dutzenden Campern folgen und ihnen beim Programmieren zusehen sowie in Chats interagieren. Das ist eine lustige und lockere Art und Weise, um von anderen Personen zu lernen, wie sie ihre Projekte umsetzen.",
"https://twitch.tv/freecodecamp"
]
]
},
{
"id": "58d9cc820ce2197370032a13",
"title": "Become a Supporter",
@ -177,49 +129,6 @@
"tests": [],
"type": "Waypoint",
"challengeType": 7
},
{
"id": "570add8ccb82ac38a17513c3",
"title": "Join our LinkedIn Alumni Network",
"description": [
[
"//i.imgur.com/vJyiXzU.gif",
"A gif showing how you can click the link below and fill in the necessary fields to add your Free Code Camp studies to your LinkedIn profile.",
"LinkedIn recognizes Free Code Camp as a university. You can gain access to our large alumni network by adding Free Code Camp to your LinkedIn profile's education section. Set your graduation date as next year. For \"Degree\", type \"Full Stack Web Development Certification\". For \"Field of study\", type \"Computer Software Engineering\". Then click \"Save Changes\".",
"https://www.linkedin.com/profile/edit-education?school=Free+Code+Camp"
]
],
"challengeSeed": [],
"tests": [],
"type": "Waypoint",
"challengeType": 7,
"titleEs": "Únete a nuestra red de alumnos en LinkedIn",
"descriptionEs": [
[
"//i.imgur.com/vJyiXzU.gif",
"Un gif mostrando como puedes pulsar el enlace de abajo y llenar todos los campos necesarios para agregar los estudios de Free Code Camp a tu perfil de LinkedIn",
"LinkedIn reconoce a Free Code Camp como una universidad. Puedes obtener acceso a nuestra larga red de alumnos agregando Free Code Camp a la sección de educación de tu LinkedIn. Define tu fecha de graduación para el siguiente año. En el campo \"Grado\", escribe \"Certificación de Desarrollo Web Full Stack\". En \"Campo de estudio\", escribe \"Ingeniería de Software\". Después pulsa \"Guardar Cambios\".",
"https://www.linkedin.com/profile/edit-education?school=Free+Code+Camp"
]
],
"titleFr": "Rejoignez notre réseau de lauréats sur Linkedin",
"descriptionFr": [
[
"//i.imgur.com/vJyiXzU.gif",
"Une gif qui montre comment tu peux cliquer sur le lien ci-dessous et remplir les champs nécessaires pour ajouter le certificat de Free Code Camp à votre profil LinkedIn.",
"LinkedIn reconnait Free Code Camp comme une université. Tu peux avoir accès à notre large réseau de lauréats en ajoutant Free Code Camp à la section éducation de ton profil LinkedIn. L’année d’obtention du diplôme est la prochaine année. Pour le \"Degré\", c’est \"Full Stack Web Development Certification\". Pour le \"Domaine d’études\", c’est \"Computer Software Engineering\". Puis sauvegardez les changements.",
"https://www.linkedin.com/profile/edit-education?school=Free+Code+Camp"
]
],
"titleDe": "Tritt unserem LinkedIn Alumni Netzwerk bei",
"descriptionDe": [
[
"//i.imgur.com/vJyiXzU.gif",
"Ein GIF, das dir zeigt, wie du den unten stehenden Link anklicken kannst und welche Felder du ausfüllen musst, damit du Free Code Camp zu deinem LinkedIn Profil hinzufügst.",
"LinkedIn erkennt Free Code Camp als Universität an. Du bekommst auf unser großes Alumni Netzwerk zugriff, indem du Free Code Camp zum Ausbildungsbereich deines LinkedIn Profils hinzufügst. Setze deinen Abschlusszeitpunkt auf das nächste Jahr. In das Feld \"Abschluss\" schreibe \"Full Stack Web Development Certification\". In das Feld \"Studienfach\" schreibe \"Computer Software Engineering\". Dann klicke auf den \"Speichern\" Button.",
"https://www.linkedin.com/profile/edit-education?school=Free+Code+Camp"
]
]
}
]
}

30
seed/challenges/01-front-end-development-certification/html5-and-css.json
View File

@ -1,9 +1,37 @@
{
"name": "HTML5 and CSS",
"order": 2,
"order": 1,
"time": "5 hours",
"helpRoom": "Help",
"challenges": [
{
"id": "560add10cb82ac38a17513be",
"title": "Learn How freeCodeCamp Works",
"description": [
[
"//i.imgur.com/ZMOCvg9.jpg",
"A picture of six freeCodeCamp campers sitting around a table coding together.",
"Welcome. You're now part of a supportive coding community. You can code online or in-person with people in thousands of cities around the world.",
""
],
[
"//i.imgur.com/EUyHs60.jpg",
"A picture of the technologies you'll learn: HTML5, CSS, JavaScript, Databases, Git & GitHub, Node.js, React.js, D3.js.",
"You'll learn to code by completing coding challenges and building projects. You'll also earn verified certificates along the way.",
""
],
[
"//i.imgur.com/LRnNMU5.png",
"An image of our open source projects on GitHub.",
"Then you'll get experience by contributing to open source projects used by nonprofits. This will help prepare you for a coding job. Let's get started!",
""
]
],
"challengeSeed": [],
"tests": [],
"type": "Waypoint",
"challengeType": 7
},
{
"id": "bd7123c8c441eddfaeb5bdef",
"descriptionPtBR": [

23
server/views/account/settings.jade
View File

@ -3,33 +3,40 @@ block content
h1.text-center Settings for your Account
hr
h2.text-center Actions
.row
.col-xs-12
a#night-mode.btn.btn-lg.btn-block.btn-primary.btn-link-social Night Mode
.row
.col-xs-12
if (!user.isGithubCool)
a.btn.btn-lg.btn-block.btn-github.btn-link-social(href='/link/github')
a.btn.btn-lg.btn-block.btn-github.btn-link-social(href='https://forum.freecodecamp.com/t/how-to-create-a-github-account-and-link-it-with-your-freecodecamp-account/132154' target='_blank')
i.fa.fa-github
| Link my GitHub to enable my public profile
else
a.btn.btn-lg.btn-block.btn-github.btn-link-social(href='/link/github')
i.fa.fa-github
| Update my portfolio from GitHub
| Update my profile from GitHub
if (!user.twitter)
a.btn.btn-lg.btn-block.btn-twitter.btn-link-social(href='/link/twitter')
i.fa.fa-twitter
| Add my Twitter to my portfolio
| Add my Twitter to my profile
if (!user.linkedin)
a.btn.btn-lg.btn-block.btn-linkedin.btn-link-social(href='/link/linkedin')
i.fa.fa-linkedin
| Add my LinkedIn to my portfolio
| Add my LinkedIn to my profile
a.btn.btn-lg.btn-block.btn-primary.btn-link-social(href='https://forum.freecodecamp.com/t/how-to-add-freecodecamp-to-your-linkedin-profile/132159' target='_blank')
| Read thousands of coding articles
a.btn.btn-lg.btn-block.btn-primary.btn-link-social(href='https://forum.freecodecamp.com/t/how-to-add-freecodecamp-to-your-linkedin-profile/132159' target='_blank')
| Add freeCodeCamp to my LinkedIn
a.btn.btn-lg.btn-block.btn-primary.btn-link-social(href='https://forum.freecodecamp.com/t/how-to-join-freecodecamps-chat-rooms-on-gitter/132177' target='_blank')
| Chat with other campers in real time
.spacer
h2.text-center Account Settings
.row
.col-xs-12
a#night-mode.btn.btn-lg.btn-block.btn-primary.btn-link-social Night Mode
.row
.col-xs-12
a.btn.btn-lg.btn-block.btn-primary.btn-link-social(href='/commit')
| Edit my pledge
| Edit my commit pledge
.spacer
h2.text-center Privacy Settings
.row

15
server/views/challenges/showBonfire.jade
View File

@ -30,19 +30,12 @@ block content
ul: li: a(href=""+link, target="_blank") !{MDNkeys[index]}
.button-spacer
if (user)
button.btn.btn-primary.btn-block.btn-lg#submitButton
button.btn-big.btn.btn-primary.btn-block#submitButton
| Run tests (ctrl + enter)
.button-spacer
.btn-group.input-group.btn-group-justified
.btn-group
button.btn.btn-primary.btn-primary-ghost.btn-lg#trigger-reset-modal
| &nbsp; Reset
.btn-group
button.btn.btn-primary.btn-primary-ghost.btn-lg#challenge-help-btn
| &nbsp; Help
.btn-group
button.btn.btn-primary.btn-primary-ghost.btn-lg#trigger-issue-modal
| &nbsp; Bug
button.btn-big.btn.btn-primary.btn-block#trigger-reset-modal Reset your code
.button-spacer
a.btn-big.btn.btn-primary.btn-block(href="https://forum.freecodecamp.com/t/freecodecamp-algorithm-challenge-guide-" + dashedName target="_blank") Get a hint
if (!user)
.button-spacer
a.btn.signup-btn.btn-block.btn-block(href='/login') Sign in so you can save your progress

10
server/views/challenges/showHTML.jade
View File

@ -27,13 +27,9 @@ block content
button.btn-big.btn.btn-primary.btn-block#submitButton
| Run tests (ctrl + enter)
.button-spacer
.btn-group.btn-group-justified
.btn-group
button.btn.btn-primary.btn-primary-ghost.btn-lg#trigger-reset-modal Reset
.btn-group
button.btn.btn-primary.btn-primary-ghost.btn-lg#challenge-help-btn Help
.btn-group
button.btn.btn-primary.btn-primary-ghost.btn-lg#trigger-issue-modal Bug
button.btn-big.btn.btn-primary.btn-block#trigger-reset-modal Reset your code
.button-spacer
a.btn-big.btn.btn-primary.btn-block(href="https://forum.freecodecamp.com/t/freecodecamp-challenge-guide-" + dashedName target="_blank") Get a hint
script.
var userLoggedIn = true;
if (!user)

13
server/views/challenges/showJS.jade
View File

@ -35,15 +35,12 @@ block content
.form-group.text-center
.col-xs-12
// extra field to distract password tools like lastpass from injecting css into our username field
button.btn.btn-primary.btn-big.btn-block#submitButton Run tests (ctrl + enter)
button.btn-big.btn.btn-primary.btn-block#submitButton
| Run tests (ctrl + enter)
.button-spacer
.btn-group.input-group.btn-group-justified
.btn-group
button.btn.btn-primary.btn-lg#trigger-reset-modal Reset
.btn-group
button.btn.btn-primary.btn-lg#challenge-help-btn Help
.btn-group
button.btn.btn-primary.btn-lg#trigger-issue-modal Bug
button.btn-big.btn.btn-primary.btn-block#trigger-reset-modal Reset your code
.button-spacer
a.btn-big.btn.btn-primary.btn-block(href="https://forum.freecodecamp.com/t/freecodecamp-challenge-guide-" + dashedName target="_blank") Get a hint
if (!user)
.button-spacer
a.btn.signup-btn.btn-block.btn-block(href='/signin') Sign in so you can save your progress

4
server/views/challenges/showVideo.jade
View File

@ -25,10 +25,6 @@ block content
a.btn.btn-big.btn-primary.btn-block(href='/challenges/next-challenge?id=' + id) I've completed this challenge (ctrl + enter)
script.
var userLoggedIn = true;
.button-spacer
.btn-group.input-group.btn-group-justified
.btn.btn-primary.btn-big#challenge-help-btn Get help
.btn.btn-primary.btn-big#trigger-issue-modal Report a bug
if (!user)
.button-spacer
a.btn.btn-big.signup-btn.btn-block(href='/signin') Sign in so you can save your progress

4
server/views/challenges/showZiplineOrBasejump.jade
View File

@ -25,10 +25,6 @@ block content
var userLoggedIn = true;
else
a.btn.btn-big.btn-primary.btn-block(href='/challenges/next-challenge?id=' + id) Go to my next challenge (ctrl + enter)
.button-spacer
.btn-group.input-group.btn-group-justified
.btn.btn-primary.btn-primary-ghost.btn-big#challenge-help-btn Help
.btn.btn-primary.btn-primary-ghost.btn-big#trigger-issue-modal Bug
if (!user)
.button-spacer
a.btn.btn-big.signup-btn.btn-block(href='/signin') Sign in so you can save your progress

5
server/views/emails/a-extend-user-welcome.ejs
View File

@ -13,10 +13,7 @@ Please verify your email by following the link below:
Feel free to email us at this address if you have any questions about freeCodeCamp.
<br>
<br>
And if you have a moment, check out our blog: https://medium.freecodecamp.com.
<br>
<br>
Good luck with the challenges!
Happy coding!
<br>
<br>
<br>

4
server/views/partials/navbar.jade
View File

@ -12,9 +12,7 @@ nav.navbar.navbar-default.navbar-fixed-top.nav-height
li.visible-xs
a(href='/map') Map
li
a(href="//gitter.im/freecodecamp/home" target="_blank") Chat
li
a(href='http://forum.freecodecamp.com', target='_blank') Forum
a(href='https://forum.freecodecamp.com', target='_blank') Forum
li
a(href='/about', target='_blank') About
li