Lets get going!
Okay, I started the day by going through some of my bookmarks and organizing them, as they can get out of hand, and in order for them to be useful, they have to be organized.
Note that jQuery is required to use Bootstrap, so include it before the Bootstrap link. This is from the Bootstrap site:
To ensure proper rendering and touch zooming, add the viewport meta tag to your
<head>.<meta name="viewport" content="width=device-width, initial-scale=1">
Note that Bootstrap includes the normalize.css file within it (or a modified version of it anyhow).
I'm attending a meetup today for MEAN stack pair programming. The meetup group is called Austin Pair Programming Circle & Code Camp.
The meetup was interesting, I stayed about two hours.
Now I'm working on some Bootstrap stuff, here's some screenshots:
The neat thing is that the page is responsive, and centered, without having written a single line of CSS. That's quite efficient.
I learned a new command today, command + ctrl + g will select EVERY copy of whatever you highlight. That comes in handy, it's pretty cool.
I'm working with Bootstrap right now, i can't wait to apply this to my portfolio! It's interesting how Boostrap is mobile-first.
Here's the bottom of an html document with jQuery connected via CDN and Bootstrap connected via a file:
<script src="http://code.jquery.com/jquery.js"></script>
<script src="js/bootstrap.min.js"></script>
</body>
</html>
Cool.
I worked on a single page app today, it's neat, in this version, you set the sections you don't want displayed by default to display: none, and the section you want to display in initially to display: block (or anything else that's visible). Then, when you click on other sections of the nav bar, the click sets the currently visible element to display: none and the new element to display: block (or anything else that's visible). This is great, because you can avoid having a bunch of files all over the place, so I'm thinking I'll use this technique for my portfolio site.
Here's how to put a downward pointer next to a link:
<li class="dropdown">
<a data-toggle="dropdown" data-target="#">Treehouse<b class="caret"></b></a></li>
That's one more arrow in my toolkit.
I held a meetup today and it went great, we had about 12 or more people show up. I helped a one of the attendees with an API issue she was having.
Good stuff!
I downloaded atom and brackets. Both have some interesting features that I haven't used with Sublime, but atom is really, really making a good impression.
This is neat, it adds a little camera to your page, it's the format for adding icons in Bootstrap:
<b class="glyphicon glyphicon-camera"></b>
I'll be using that. This adds a "user" icon:
<b class="glyphicon glyphicon-user"></b>
Here's a pic with both icons:
Bootstrap is great!
As an aside, in Bootstrap, when we give a div a class of "container," that sets the element to a max width of 1000px, according to the video.
Okay, I'm driving down to South Texas now (6 hour drive), so I'm going to close out this entry and continue tomorrow.
SUMMARY OF CODING SKILLS
Other Courses: Status
Free Code Camp (FCC) Status
The Coding Boot Camp at UT Austin Status (starts 4/19/2016)
Week 1-6: Mastering the Browser (HTML, CSS, JavaScript, JQuery)
The meetup was interesting, I stayed about two hours.
Now I'm working on some Bootstrap stuff, here's some screenshots:
I learned a new command today, command + ctrl + g will select EVERY copy of whatever you highlight. That comes in handy, it's pretty cool.
I'm working with Bootstrap right now, i can't wait to apply this to my portfolio! It's interesting how Boostrap is mobile-first.
Here's the bottom of an html document with jQuery connected via CDN and Bootstrap connected via a file:
<script src="http://code.jquery.com/jquery.js"></script>
<script src="js/bootstrap.min.js"></script>
</body>
</html>
Cool.
I worked on a single page app today, it's neat, in this version, you set the sections you don't want displayed by default to display: none, and the section you want to display in initially to display: block (or anything else that's visible). Then, when you click on other sections of the nav bar, the click sets the currently visible element to display: none and the new element to display: block (or anything else that's visible). This is great, because you can avoid having a bunch of files all over the place, so I'm thinking I'll use this technique for my portfolio site.
Here's how to put a downward pointer next to a link:
<li class="dropdown">
<a data-toggle="dropdown" data-target="#">Treehouse<b class="caret"></b></a></li>
That's one more arrow in my toolkit.
I held a meetup today and it went great, we had about 12 or more people show up. I helped a one of the attendees with an API issue she was having.
Good stuff!
I downloaded atom and brackets. Both have some interesting features that I haven't used with Sublime, but atom is really, really making a good impression.
This is neat, it adds a little camera to your page, it's the format for adding icons in Bootstrap:
<b class="glyphicon glyphicon-camera"></b>
I'll be using that. This adds a "user" icon:
<b class="glyphicon glyphicon-user"></b>
Here's a pic with both icons:
Bootstrap is great!
As an aside, in Bootstrap, when we give a div a class of "container," that sets the element to a max width of 1000px, according to the video.
Okay, I'm driving down to South Texas now (6 hour drive), so I'm going to close out this entry and continue tomorrow.
SUMMARY OF CODING SKILLS
Books: Status
"Head First HTML and CSS," by E. Robson & E. Freeman Complete
"Head First HTML and CSS," by E. Robson & E. Freeman Complete
"A Smarter Way to Learn JavaScript," by Mark Myers Complete
"HTML and CSS," by Jon Duckett Complete
"JavaScript and JQuery," by Jon Duckett Complete
Team Treehouse (Front End Web Dev Track Complete): Status
How to Make a Website Complete
HTML Complete
HTML Forms Complete
HTML Tables Complete
HTML Video and Audio Complete
CSS Foundations Complete
CSS Basics Complete
CSS Layout Techniques Complete
CSS Layout Basics Complete
CSS Selectors Complete
Responsive Layouts Complete
CSS Flexbox Layout Complete
Git Basics Complete
Console Foundations Complete
Introduction to Programming Complete
JavaScript Basics Complete
JavaScript Loops, Arrays, & Objects Complete
AJAX Basics Complete
JQuery Basics Complete
Interactive Web pages with JavaScript Complete
Object-Oriented JavaScript Complete
Accessibility Complete
Website Optimization Complete
Front End Performance Optimization Complete
Aesthetic Foundations Complete
Design Foundations Complete
Adobe Photoshop Foundations Complete
Adobe Illustrator Foundations 66% Complete
Other Courses: Status
HTML and CSS (Codecademy) Complete
Introduction to Web Dev (The Odin Project) Complete
Web Dev 101 (The Odin Project) 33% Complete
Free Code Camp (FCC) Status
1. Get Started with Free Code Camp Complete
2. HTML5 and CSS Complete
3. Responsive Design with Bootstrap Complete
4. Gear up for Success Complete
5. jQuery Complete
6. Basic Front End Development Projects Complete
7. Basic JavaScript Complete
8. Object Oriented and Functional Programming Complete
9. Basic Algorithm Scripting Complete
10. JSON API's and Ajax Complete
11. Intermediate Front End Development Projects Complete
5. jQuery Complete
6. Basic Front End Development Projects Complete
7. Basic JavaScript Complete
8. Object Oriented and Functional Programming Complete
9. Basic Algorithm Scripting Complete
10. JSON API's and Ajax Complete
11. Intermediate Front End Development Projects Complete
12. Intermediate Algorithm Scripting Complete
13. Advanced Front End Development Projects Complete
14. Claim Your Front End Development Certificate Complete
The Coding Boot Camp at UT Austin Status (starts 4/19/2016)
Week 1-6: Mastering the Browser (HTML, CSS, JavaScript, JQuery)
Week 7-10: API & JSON (RESTful API"s, parsing JSON, AJAX)
Week 11-14: Server Side (Node.js, MySQL, MongoDB)
Week 15-18: PHP (WordPress, CodeIgniter, Laravel)
Week 18-21: Full Stack Coding
Week 22-24: Final Project
CodePen Projects: http://codepen.io/Adancode/
Week 22-24: Final Project
CodePen Projects: http://codepen.io/Adancode/
GitHub Projects: https://github.com/Adancode
LinkedIn Profile: https://www.linkedin.com/in/adamcamacho1
Team Treehouse Profile: https://teamtreehouse.com/adamcamacho
Free Code Camp Profile: http://www.freecodecamp.com/adancode
Team Treehouse Profile: https://teamtreehouse.com/adamcamacho
Free Code Camp Profile: http://www.freecodecamp.com/adancode
Hours Spent Coding Today: 8
Total Hours Coding: 1,096
No comments:
Post a Comment