greatbody
/
freeCodeCamp
mirror of https://github.com/freeCodeCamp/freeCodeCamp.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

update landing page

pull/2/head
Michael Q Larson 2014-10-18 14:53:32 -07:00
parent 5dbbb935a5
commit eb2de28f6a
3 changed files with 55 additions and 142 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

122
public/css/styles.less
View File

@ -2,7 +2,7 @@
@import "lib/font-awesome/font-awesome";
@import "lib/ionicons/ionicons";
@import "lib/bootstrap-social";
@import "themes/modern";
@import "themes/yeti";
// Scaffolding
// -------------------------
@ -30,7 +30,7 @@ footer {
}
}
h1, h2, h3, h4, h5, h6, p {
h1, h2, h3, h4, h5, h6, p, li {
padding-top: 5px;
padding-bottom: 5px;
}
@ -101,122 +101,8 @@ ul {
word-wrap: break-word;
}
/* Pages */
.pages {
height: 100%;
margin: 0;
padding: 0;
width: 100%;
}
.page {
height: 100%;
position: absolute;
width: 100%;
}
/* Login Page */
.login.page {
background-color: #000;
}
.login.page .form {
height: 100px;
margin-top: -100px;
position: absolute;
text-align: center;
top: 50%;
width: 100%;
}
.login.page .form .usernameInput {
background-color: transparent;
border: none;
border-bottom: 2px solid #fff;
outline: none;
padding-bottom: 15px;
text-align: center;
width: 400px;
}
.login.page .title {
font-size: 200%;
}
.login.page .usernameInput {
font-size: 200%;
letter-spacing: 3px;
}
.login.page .title, .login.page .usernameInput {
color: #fff;
font-weight: 100;
}
/* Chat page */
.chat.page {
display: none;
}
/* Font */
.messages {
font-size: 150%;
}
.inputMessage {
font-size: 100%;
}
.log {
color: gray;
font-size: 70%;
margin: 5px;
text-align: center;
}
/* Messages */
.chatArea {
height: 100%;
padding-bottom: 60px;
}
.messages {
height: 100%;
margin: 0;
overflow-y: scroll;
padding: 10px 20px 10px 20px;
}
.message.typing .messageBody {
color: gray;
}
.username {
float: left;
font-weight: 700;
overflow: hidden;
padding-right: 15px;
text-align: right;
}
/* Input */
.inputMessage {
border: 10px solid #000;
bottom: 0;
height: 60px;
left: 0;
outline: none;
padding-left: 10px;
position: absolute;
right: 0;
width: 100%;
.img-center {
margin:0 auto;
}
/**/

0
public/css/themes/modern.less → public/css/themes/yeti.less
View File

75
views/home.jade
View File

@ -3,54 +3,81 @@ block content
.jumbotron
.text-center
h1 Become a Software Engineer
h2 Our free online coding bootcamp will help you land your first coding job!
h2 Learn to code by collaborating on projects for non-profits
.row
.col-xs-12.col-sm-12.col-md-4
h3 Technical Mastery
img.img-center.three-by-three.img-responsive(src="images/tools.svg")
p Pair program your way through our courses and coding challenges.
p You'll use pair programming (where two people code together on one computer) to work through our coding challenges.
.col-xs-12.col-sm-12.col-md-4
h3 Unique Portfolio Projects
img.img-center.three-by-three.img-responsive(src="images/portfolio.svg")
p Contribute to Open Source Software. Work closely with non-profits and solve their problems with code.
p You'll apply your new coding skills to help non-profits create software solutions to their problems.
.col-xs-12.col-sm-12.col-md-4
h3 Glowing References
img.img-center.three-by-three.img-responsive(src="images/references.svg")
p Gain the esteem of your peers and the people you help.
p You'll gain the respect of your peers and the people you help. These connections will help you land the job.
a.btn.btn-cta.btn-primary(href="/login") Sign in now to get started (it's free)
br
br
a.btn.btn-success(href="/contact") I'm with a non-profit and want free help from a Software Engineer
br
.jumbotron
.text-left
br
h2 How long does this take?
p It takes about 1,000 hours to master the skills you need to get an entry level software engineering job, or roughly one year if you code for 20 hours per week.
h1.text-center Frequently Asked Questions
h2 What will I learn, and in what sequence?
ol
h3 In the first 100 hours, you'll learn basic web design tools like:
h3 First, you'll learn basic web design tools like:
h4
ul
li &#8226 HTML5
li &#8226 CSS3
li &#8226 Bootstrap
li &#8226 jQuery
h3 Then you'll spend about 400 hours learning programming and computer science:
li &#8226 HTML - the structure of web pages
li &#8226 CSS - the design of web pages
li &#8226 Bootstrap - a "responsive design" tool to help your websites look great on tablets and phones
li &#8226 jQuery - a powerful tool for controlling websites in the browser
h3 Then you'll learn computer science and the art of programming:
h4
ul
li &#8226 JavaScript
li &#8226 Linux
li &#8226 Git
li &#8226 Relational Databases
li &#8226 Algorithms
h3 You'll spend the final 500 hours using Agile Methodologies and Full Stack JavaScript to build projects for non-profits:
li &#8226 JavaScript - the programming language that all web browsers use.
li &#8226 Linux - the most popular operating system for servers (but you don't need to learn desktop Linux)
li &#8226 Git - the best way to save and share your projects
li &#8226 Databases - SQL is like a giant spread sheet that stores and retrieves your data
li &#8226 Algorithms - these are basically step-by-step recipies for getting things done
h3 You'll spend the last half of Free Code Camp using Agile Methodologies and Full Stack JavaScript to build projects for non-profits:
h4
ul
li &#8226 MongoDB
li &#8226 AngularJS
li &#8226 ExpressJS
li &#8226 NodeJS
li &#8226 Agile Methodologies - the fastest way to design and build projects that clients will actually use.
li &#8226 MongoDB - a popular non-relational database
li &#8226 AngularJS - a tool for making exciting
li &#8226 ExpressJS - a powerful web development framework
li &#8226 NodeJS - a JavaScript-based web server
h2 How will I learn all this?
h3 By pair programming with other Free Code Camp students on our exercises. Don't think of programming as a lonely art - it's a collaborative process, and programmers learn better together. We've also built an optional curriculum of the best free courses on the web. Some people prefer working through the courses. Some people prefer to googling around for documentation and Stack Overflow posts when they get stuck. Most people do a little of both.
h3 By pair programming with other Free Code Camp students on our coding challenges. Don't think of programming as a lonely art - it's a collaborative process, and programmers learn better together. We've also built an optional curriculum of the best free courses on the web.
h2 How long does Free Code Camp take?
p It takes about 1,000 hours of coding to develop the skills you'll need to get an entry level software engineering job. Many in-person coding bootcamps jam all this into 12 weeks of intensive study. Free Code Camp is fully-online, and there will always be other people at your skill level that you can pair program with, so you can learn at your own pace. Here are some example coding schedules:
table.table
th Time budgeted
th Hours per week
th Weeks to complete
tr.info
td Weekends
td 10 hours/week
td 100 weeks (2 years)
tr.success
td Nights and Weekends
td 20 hours/week
td 50 weeks (1 year)
tr.warning
td Weekdays
td 40 hours/week
td 25 weeks (6 months)
tr.danger
td Traditional Bootcamp Pacing
td 80 hours/week
td 12 weeks (3 months)
h2 Why does Free Code Camp use JavaScript instead of Ruby or Python?
h3 We love Python and Ruby. But even if you learn them, you'll still need to learn JavaScript. JavaScript is the most important language of all - it's the language of web browsers. It's also the most popular language.
br
img.img-center.img-responsive(src="http://dberkholz-media.redmonk.com/dberkholz/files/2014/04/github_new_repos-custom.png", style="max-height: 300px;")
h2 Will I really be able to job afterward?
h3 At the end of Free Code Camp, you will have pair programmed around 1,000 hours with dozens of other students, built a portfolio of projects that people are actively using, and a roster of glowing references from non-profits you've helped. 75% of bootcamp graduates get software engineering jobs, and make an average annual salary of $76,000.
a(href='https://www.coursereport.com/2014-graduate-survey.pdf', target='_blank')   (Source)