Computer circuitry header

"The beginning is the most important part of the work"
― Plato (Circa 390 B.C.E.)

As I rapidly approach the end of my 20's, I have been struck by the fire of ambition and have found myself addicted to the learning of new things in the Computer Science field, and to working on new, interesting projects and problems. I have been reading a LOT about programming, text books, technical API's, Stack Overflow posts, but I have also been reading a lot of advice articles and books for young people going into the computer science fields, what to expect, and what to do to further your career and push yourself forward in the industry. One piece of advice that was universal was that programmers should be blogging. Yes, this piece of advice was pretty much everywhere. So, not one to ignore sound advice, yesterday I sat down with my favorite text editor, brewed up some coffee, downloaded some common JavaScript libraries like jQuery, and I was off.

I'm still learning everything I can about CSS3, but from what I know already it is amazingly powerful. It is also amazingly repetitive. I have been tinkering with an interesting language known as SASS or Syntactically Awesome Style Sheets or sometimes as Syntactically Correct Style Sheets. It is a pretty neat way to write CSS that makes it more syntactically similar to a programming language. The interpreter in your browser can't read it however, so what you do is you write the code in SASS, and a compiler transforms it into a normal .css file for use on the web. Pretty cool when you consider how much time you can save with the language once you get used to it. I would definetely still recommend to people that they learn CSS first, but if you're like me and all the repetition and slow monotony of writing a CSS file gets to you, then you should definitely be giving Syntactically Correct CSS a look. I finished getting all my code written for the outline and I decided to write this post to get this page going.

The rollover social media buttons on the bottom of this page I did entirely with CSS and a single 48 x 96 .png file for each image. The idea was for it to invoke the feeling of flipping a bit on or off, 1 or 0. I grabbed company logos on transparent backgrounds with a Google search and made sure they were 48 x 48. Then I doubled the image placing the copy directly below it in the lower half of the rectangle. I added the transition effect with the following CSS code:

I copied the last section of code for every image in the row, using each of the individual background images for their associated sites. Then I made a table in the site footer and put the div elements and links in each column. They looked like so:

<a href="https://github.com/stephenmirving" target="_blank" title="GitHub">
<div class="github-hover social-slide" alt="GitHub" title="GitHub Link"></div></a>

After getting the index page HTML, CSS, and basic JavaScript looking pretty much the way I wanted it to, I fired up Adobe Dreamweaver 2015 to do some fine tuning with a visual representation of what I'm doing without having to keep switching over to previewing it in a browser. I set up a new project in Dreamweaver and made two templates from my index file, one for blog posts and one for the rest of the pages I needed to make to complete the site. I created a few more pages and then set up an FTP connection with my hosting server and started pushing stuff on to the web.

“Be willing to be a beginner every single morning.” ― Meister Eckhart

I decided since it was past 3 in the morning, now would be an excellent time to crank out my first blog post, while my thoughts were still fresh in my mind! My next goal over the following couple of days will be to take my resume and all the associated pages, such as the cover letter, letters of recommendation, school transcripts, commendations, and my diploma, and convert all those into large sized image files. Then I'm going to write some JavaScript that will enable me to make a site where all those documents will be displayed as actual 'pages' that can be turned like the pages of a book, using either the mouse to click on the corners of the 'pages', the keyboard left and right keys, or swiping on a mobile device. I will definitely have to spend some time optimizing the layout and responsiveness of that, and of the rest of the site, for mobile viewing. Once that is done it won't be long until the entire site is completed, and I can go back to focusing on my other projects, and write about those! I hope some of you will follow along with me as I move forward in my education and build on my career. I'm excited to continuing to learn all I can about programming and the industry as I enhance my skills and write about it every step of the way.


Comments


Leave a Comment

Please keep in mind that comments are moderated and rel="nofollow" is in use. So, please do not use a spammy keyword or a domain as your name, or else it will be deleted. Thank you!

Make sure you use a valid email address