Blog

Juggling code, struggling Node

Ive left this blog post a little longer than usual at 2 weeks, just because I didn’t feel like I had much worthwhile to write. Over the first week I delved into node but to be honest I found the structure of the course a bit confusing. I found that I struggled a bit with the wording of the tasks and that I needed to become fluent in tech talk before I could actually progress. When I came to a solution I realised that it was much simpler than I would make out, and it would take me so long to decipher each word, but I’d only realise how simple it was once I finished. I’ve spent longer than I’d have liked trying to get the hang of callbacks but nevertheless I’ve ploughed on as much as I can in my limited free time. I love the idea of asynchronous code – the lack of which plagued me in some of my front-end javascript tasks. Although I like a set structure to code which makes it easier to debug when you know the code follows a process, having code that can be called upon later I find quite refreshing….at least I think that’s what happening!…actually, reading that back it doesn’t sound right…I dunno, I’ll figure it out soon

To help me with freecodecamp’s node course I’ve decided to purchase the Web Developer’s Bootcamp class on Udemy.com. I felt that I really needed some guidance on some of the terminology on this part so I hope that by taking the node portion of this course that it will simplify my FCC tasks much more. I feel that if I could just decipher what’s being asked of me then I would stand a much better chance of completing the challenges, and I’m hoping this course can help. But more on this course in a little while…

As noted my time has shortened quite considerably recently which unfortunately has taken a big hit on my coding efforts. I still try to code everyday and when I can’t I make sure to listen to a CodeNewbie podcast or watch a tutorial. But my work demands and the study towards my professional qualifications that go with it have really come into force this past fortnight. I’ve found the capacity to work on something that I love to do really falling short. I’ve realised that this is what I want to do a lot more of, and I find any free moment I have that I’m wanting to code and learn something new and relevant, but at the moment that’s just not happening. Exams are towards the end of the year but the demands are so high so it means a lot of time is spent away from the text editor.

In light of this, I want to really develop a polished portfolio page to show off what I have learnt in this short time. Who knows, maybe this will open avenues that mean I spend more time coding. So to do that, I’m going over some of the CSS parts of the web developer course so that I can really make a good impression with my portfolio page. I’ll migrate all my codepen work over to github so that I’m really utilising that resource which will in turn help with my online presence. Soon I’ll have to change my online moniker to something more professional, but I’m not ready to let go of that just yet!

People closest to me are worried I’m spreading myself to thin. Work, study, trying to be active – I have no idea how parents manage to do anything productive! I have the utmost respect for people learning new things and making bold life-choices while they have other, much bigger responsibilities on their plate than mine. I’ve been told to take a holiday, but in my mind I’d want to spend the week on a mini-made-up bootcamp of my own, but that would completely defeat the object (it sounds ridiculously sad too…I need a word with myself!). The fight between logical and emotional needs is a tough one, and I probably end up like a spoilt child when I think about logical needs winning!

Back to code and I’ve had a couple of small changes that were very much-needed and I think are pushing me in the right direction. Only small but they’re massive to me! The first is actually setting up a text editor. Moving away from the comfort of CodePen is something I’ve needed to do for a while. Previously I tried to use atom which, for some reason…probably stupidity on my part, I struggled with the markdown option. I couldn’t get something that looked and felt like my codepen efforts. To be honest I couldnt get any javascript to work at one point, then another effort meant none of my CSS worked. Playing detective and looking at their link tags didn’t seem to help but I persevered. Until….it took an hour and a half to open up a simple set of html/css/javascript files. I gave in. I got some storage space, migrated all my big files and reset my mac to factory settings. I felt like a tired parent who just slammed their book shut, got up, exclaimed “Right, no more TV for you”, and stormed out the room as my Macbook just cried all the way to PC World (the laptop didnt come with me…but you get it!).

So I did it. Started a fresh. Got rid of a load of junk I didn’t use and now I have a fully operating Macbook. I honestly can’t explain how happy I am I did that. Totally worth it. My computer actually does things when I tell it to now. It doesn’t spend hours just thinking about what I asked it to do, like a stoner being asked to solve a differential equation. It finally works. So I intend to keep it that way!

So after atom, I tried a bit of Visual Studio Code and I really liked that. I think it’s exactly what I need from a coding setup. And I think I’ll move back to it – the web dev course tells you to download sublime, and thinking that I didn’t want to miss out on what they were doing, or try to figure out how to do xyz on my own system, I downloaded sublime’s effort. To be honest, I don’t have anything against it, it’s simple and to the point. But I did like Visual Studio, so I’ll probably end up going back to that at some point.

To be honest, this is where I’ve got to. Running around in circles, not feeling like I accomplished anything, feeling a bit down that I’m not able to get to the thing I want to do the most. Hopefully it’s short-term, but knowing how my work-cycles flows, I severely doubt this. I’m at the bottom of the roller-coaster, working my way up the steep gradient to the worst part (I really don’t like roller-coasters!).

I promise the next post will be brighter!

Advertisements

Freecodecamp – Front-end to Back-end certs

This has been quite the week! Last week I was on the cusp of finishing my front-end certification with freecodecamp and I was so chuffed to get that finalised with the completion of my Simon game and 3 remaining algorithm challenges. I put my obligatory front-end certificate pic up on twitter and went to bed.

I woke up to look at my phone and i had tonnes of notifications from complete strangers congratulating me on my achievement, many asking for insight into my experience in the view to helping them with theirs. It was really such a humbling shock to have so many people reach out to offer their congratulations and I’ve been so pleased all week.  I really didn’t appreciate the support from the coding community and how there are so many people in a similar position to me wanting to ask me questions, I was really overwhelmed!

This whole experience really gave me the motivation to push on with the other portions of the freecodecamp curriculum. Data visualisation had a couple of “coming soon” sections to its material so I decided to crack on with the back-end certification instead…

two states

…..yeah….

We started with an introduction to Git and GitHub, which I was quite looking forward to as I appreciate the importance they play in the industry. This was fine – although I didn’t fully understand some parts it, provided good reference to go back to for other projects.  Since then I’ve been on the node.js introduction starting with node package manager. To be honest there were parts here that I was just copying and pasting instructions, completely feeling like the dog in the picture above. Over time this feeling started to subside as I subconsciously figured out some of the meanings. But I completed the npm course not fully appreciating what it meant or what it was for…

Today I started with the main node.js intro and this is more in my skill set.  It brings in some of the javascript elements from the front-end but trying to bring them into the node environment.

But the whole switch has been a bit of a shock. It feels like the stabilisers are off as I come away from the freecodecamp and codepen environments and move to cloud 9’s terminal. But you’ve got to be a big boy one day! I did try atom the other week and that did not turn out so well, so an intermediate step with cloud 9 is absolutely required! This was me with atom…

stabilisers

Otherwise there hasn’t been a lot to it this week, just trying to get my head around this terminal malarkey and starting from scratch again.

I listened to an early CodeNewbie podcast this week and I’ve decided to incorporate another kind of page to my blog posts. Rebecca Miller Webster in episode 64 of the CodeNewbies podcast talks about writing a blog post about an issue you incurred during your journey. My initial aim for this was to do something similar but it never materialised and became more of a journal. Whilst I think this is fine I felt that I missed a trick with not writing about some of the concepts I struggled with in the front-end cert and so I’ll be looking to do that more with the back-end work, particularly through the projects I’m doing.

I would write a post about setting a time delay on a javascript for loop but considering a typo ended up to make my code work I don’t think I’m in the best place to write that post!

Anyways, just short one this week. I’m sure I’ll have more to write when I actually figure out what I’m doing with node!  Soon.jpeg…..

Simon says…go!!!!

Just a quick update from my post yesterday – I did finish it! Very chuffed with myself. Testing against the master array was a lot simpler than I expected, so too was passing over control. I managed a couple of breakthroughs late last night and this morning which meant I just needed to tidy up a few points such as a winners message after level 20 and putting in some audio.

I didn’t like the sound of the beeps freecodecamp supplied so I tried to find my own effects.  I found one resource with a few sound effects from star wars, so I thought this was too good an opportunity to turn down, particularly with a Chewbacca sound effect! However, when Chewy kicks off 3 times in a row, you need a mute button, so I had to put that in!

Anyways, short and sweet – here’s my codepen (I’d recommend you look in full-page view btw!).  3 more algorithm challenges and I complete the front-end certificate!

Tic-Tac-Toe, Simon says…no. FreeCodeCamp

The roller-coaster continues…

I’ve had less time to sort my projects this week and while I completed my tic-tac-toe project, I was unable to get through all of the Simon game challenge.  To be honest, even with an extra day holiday tomorrow I think it’s a stretch, this rabbit hole looks to be a deep one!  Here’s my freecodecamp weekend:

Tic-Tac-Toe

Deceptive! I looked at this challenge and thought it was something I could definitely get my teeth stuck into, and with my Maths background I thought it would be easy to implement a minimax formula later to have an ultimate tic-tac-toe game.  So – just sort the rest out first, get a basic comp player up and running and solve later right??  Not so fast there! This challenge brought up some new problems that I hadn’t considered fully from the outset.

My biggest issue was trying to run before I could crawl. I’ve always looked at my code thinking “how can I cut this down to be more eloquent from the beginning”. This thought was particularly prevalent coming into the challenge as I spoke to someone in the industry earlier in the week.  They mentioned a site called Codility, where you can test your baseline skills and see how well you compare against others in the field.  The first challenge they have is a refactoring test which, tbh, I struggled with. I also know that GitHub is the place everyone goes to judge your coding ability, and if my current content was there it would be a rugged landscape of if & else statements where DRY is considered and thrown away. So I wanted to really challenge myself and write better code from the off, especially with the focus of not repeating myself….that didn’t go so well.

This was all to my disadvantage. I’ve read it before though, so it’s my own fault for not paying attention – solve the problem first, refactor later.  I missed this important step and ended up really struggling to get my game to work straight away. This cost me some time in getting everything finalised, but taught me an important lesson in the meantime.

It was good to learn simple things like passing over control to the computer and vice versa. Dialog boxes were a new and annoying phenomenon to me. With codepen constantly refreshing, and the box reloading, that got tiring really quickly.

Looking over my code now as I write this blog, there are so many obvious refactoring opportunities which I think “why didn’t you do that in the first place”, but I think I should just refer to my earlier comment!  I’ve decided that after my front-end certificate is over I’m going to go over my code from all my codepen challenges and refactor as much as I can. Then maybe later on in my journey I’ll refactor again as my knowledge grows and I spot new ways to improve my code. But for now, lets get this finished!

CSS still eludes me. Man I need some design lessons! It’s not where I see my skills lie and it’s not something I particularly want to master, but I do desperately need to gain some basic knowledge on this topic!  Here’s my codepen:

Simon Game

I haven’t had an awful lot of time on this one to be honest. To date I’ve set up my buttons, sorted the css and click functions to make them appear to lighten up for a small period of time. Everything was going pretty well, until I needed to implement a delay between buttons getting called.  My last blog post talked about the ups and downs I felt as I completed my earlier challenges and this was no different. I managed to call a pattern from a master array and send that to the button functions which I felt pretty good for, and then instantly I realised that an array of more than 1 just wasn’t getting called. I read this post about the issue which basically says that my code waits for no man, and just fired off all buttons simultaneously, even though I had a setTimeout call involved.  Probably an hour or so in and out of the issue and then reading other blog posts, I sorted out some code, still struggled, then one typo and boom!  Problem solved.  I mean, I still don’t get why it wasn’t working before and now it miraculously does….but still, it works!

Confused girl

Now it’s dawned on me that I need to consider how I’m going to pass control to the user, test against the current pattern, give feedback, etc, etc.  This one’s going to be the toughest one yet, and that’s why I don’t think I’ll be able to complete it all by the end of tomorrow.  But I’ll give it a good go!

If you’ve read this far, I thank you for that and I’ll pass on some knowledge I’ve gained from this weekend – Janis Ian – At Seventeen – awesome chill out coding tune. Coupled with the Girl from Ipanema and I’m set.

Toodles.

My freeCodeCamp weekend

This weekend has given me some of the mental highs/lows that I’ve read about for Code Newbies and it has enforced a belief in karma that I never once thought about.

I started the weekend excited to get through as much of the remaining freecodecamp challenges as possible, eyeing up the two first advanced projects on the front-end course.

Javascript calculator

Friday night saw me start FreeCodeCamp’s first advanced project – the javascript calculator.  Quincy Larson warns at the start that this will take some time to grasp what’s going on, and initially I didn’t have this struggle, completing the majority of a basic MVP in a relatively short space of time. Feeling good, I posted as much on my twitter account.

The instant I did this, I went back to my calculator and discovered I couldn’t multiply by anything higher than 9 – my model immediately invoked a calculation on the press of the first number after an operator. This issue took me about an hour to figure out the solution for, and a similarly proportionate amount of motivation with it. I left my project for the night with the aim to solving my clear and decimal point buttons for the morning.

Saturday morning proved to be the main frustrating portion of the weekend. Not fully appreciating the brief of the project, I decided to construct a clear entry button for my calculator. Panic then sets in as think I need to start again from scratch as I try to envisage creating a master array that details every point in the process so that the last entry can be popped off, then having to reduce the array to summarise the calculation.  After a review of the video I realised that both clear buttons had the Clear All functionality, which I had already done. Now…this feels like the cheap and easy way out, and maybe one day I’ll revisit my calculator to incorporate this feature (not likely), but for now, I ploughed on.

For my decimal point I decided include a period as a string first and then calling a Number() method to the string. In hindsight I don’t fully know why I thought this would work – it didn’t. The hardest part was seeing my console display 2.3 while my calculator displayed 23. I felt like Happy Gilmore telling his ball to get in his hole.

Happy-Gilmore-Adam-Sandler

I once saw a TedTalk video that discussed spatial thinking and how a child chess prodigy would walk away from the board, look completely disinterested then come back with an amazing move. Having his brain wander he was able to clear his mind and think more clearly. Well…I went to the shops to buy some toilet roll, came back and solved my issue in 2 mins.  Don’t know how I did it, I think I might have blocked this whole process from my memory, but maybe I should give chess a go???

Rounding it all off, the functionality of my calculator was pretty sound (I hope!) – css still leaves a lot to be desired, so much so that I think I need to do a proper css course soon. How can centering on a page be so difficult?!

Pomodoro Clock

On the crest of a wave I decided to dive headfirst into the pomodoro clock Saturday night, probably to my disadvantage – I tried to plan and scope out exactly how I wanted to approach this but:

  1. I thought it was pretty simple; and
  2. I’m pretty hyped so minimal planning needed, lets crack on!

Yeh, that wasn’t great.  I started really confident, plodding along getting everything sorted, and really got the basic countdown finished, allowing for different states that you may be in (e.g. starting a new timer, starting from paused, finishing the timer). But then I hadn’t allowed for the start of the break period. And this is where my struggles returned.

The more and more I dug into the rabbit hole I realised I was further and further away from the end. In a blind panic I decided to completely rehaul my javascript a good couple of times. How can something so simple be so difficult for me to code? I realised that as I hadn’t planned as much as I should have on this occasion then I just got myself tangled in my old mess of code. So a final restart was needed and this was much better. I realised I wanted to set one timer function which covered both states, rather than creating two separate ones and jumping from the two. This last design was a good one, and my countdown easily flitted between active/resting states. Feeling pretty good…then karma tapped me on the shoulder. As soon as I paused my counter, I get some output that was completely wrong. I started the counter again and more weird output. Apparently this iteration of the paused state didn’t carry over so well.

So here I am. Having seen these ridiculous states I decided to summarise my coding weekend, partly to share my experiences (which overall are very positive) but also, selfishly, in the hope of getting some more grandmaster inspiration.

My weekend has gone and I’ve sat 12inches away from my monitor for the majority of it. But I’ve thoroughly enjoyed every minute and I’m looking forward to next weekends’ challenges already. It’s easy to say this now that most of my problems are resolved – had I written this at the decimal issue this post would be a whole lot bleaker! Over the rest of the evening and this week I hope to finalise my pomodoro clock so that I’m ready for the tic-tac-toe game I hear so many Code Newbies attempt.  That leaves Simon’s game and 3 more algorithm challenges before I complete my front-end certificate.  Looking forward to that day!

Much Code. Many typing. Wow.

Wow indeed.

This weekend saw me have a complete coding binge on freecodecamp.com. Whilst I was able to log on during the week, the small amount of time after work and lack of brain function meant I found my time was best spent on smaller algorithms and focusing on one/two problems a day. But this weekend saw an assault on the outstanding intermediate projects which I needed to tackle.

Wikipedia Viewer

Firstly I completed a simple wiki viewer which can be found below:

I enjoyed this challenge. It taught me how to show outputs in the form of bullet points, using a fade in effect and most importantly – successfully using an API call after the nightmare of the random quote generator! I can’t describe how much of a relief it was finally seeing and working with some JSON data after all of my previous troubles.

I think given the extensive use of javascript in the algorithms sections/other projects I’ve become much more comfortable with that language. My lack of css knowledge is showing in the design of my projects, so I’d like to get more experience there once I’ve completed the front-end project. Maybe the daily css challenges could help me in this area, but I’m far more comfortable working with javascript at the moment. I particularly enjoy writing a function to perform correctly for one iteration and then extending for further cases. I find this method makes it much easier to develop as I work with one case at a time, making sure it’s in the format I want and then extend for more iterations.

I did however struggle for a solid hour and a half wondering why my anchor wasn’t updating from my javascript. I did a few things and was outputting the anchor ref which stated it was updated, but whilst clicking through it would always revert to my original codepen site, meaning the link wasn’t right. Turned out after 1.5 hours it was due to a premature closing anchor tag before I closed a bullet. 1.5 hours man…. 😐

Overall though this was a cool project and it taught me a lot. Mostly about anchor tags and closing them properly.

Twitch API

Well…sort of twitch api. According to the website you’d need an API key for this and for security reasons freeCodeCamp are suggesting using dummy data. This was kind of a shame as it felt like a cheat, but the most important thing was getting the website up and running with what we had to work with.

My proudest moment with this project was my dynamic bullet points. There is no way to make that sentence sound less sad. For me I felt that as an important mark and something that I’ll likely use more often in the future. I think this was quite a straightforward challenge for me in the end, most likely due to the lack of API knowledge required. Working with a data set already set up was far easier for me and I was able to program up my javascript according to that data.

It isn’t the prettiest and I cold have spent more time trying to get it to look nicer but I was very happy with my delayed fade in/out functions. That was a cool little trick for me to learn. I’ve still not figured out the scroll into view method but I’ll be sure to give it a go in one of my next projects, or when I refactor these ones when I tidy up for my portfolio site.

This project gave me a lot more confidence in what I was doing and showed me I was learning a lot. But still it showed my weaknesses lie in presentation. I remember a primary school teacher telling me that very same thing…

Random Quote Generator

If I was better at wordpress, I’d figure out how to play operatic singing voices in the pits of hell type music when coming to the RQG section. This was definitely my nemesis. After having so many issues trying to get any data from the forismatic API I gave in and went for something else. People told me it was a CORS issue and no matter how much I read up and asked I still had no idea why it couldn’t work. I went with another API and it was ready straight away. This was so frustrating. I had people say it was the browser I was using, other people got it to work, others still couldn’t. But mine was never working no matter what I tried. This project was started a while before the others and could have easily derailed me from learning code altogether – i was THAT frustrated. Fortunately I persevered and got something I’m pretty happy with. Again, css has proven an issue, particularly when changing browser sizes. I’ve put everything in a “container-fluid” div which I thought would help but apparently not.

In full view I generally quite like the look of it. I don’t like, however, how my buttons move with the size of the text box. But the functionality is there, particularly with the tweeting out which I was quite chuffed with.

Overall the most important thing this project taught me was not to let a fricking API stand in my way! Man I’m still so p*ssed…

Overall

Like I said I’ve learnt a lot. I like to think that my maths background has helped in how I structure my code in each iterations of a for loop, e.g. linking text to a parameter to have dynamic values. I think I have a good grasp on how to tackle problems, my issue is then putting them in a way that looks good! I’ve got 8 algorithm challenges and 4 advanced projects to go through before I can get my front-end certificate which I’d be extremely happy to get. The advanced projects look cool too, bringing in some games and audio to the programs so I’m looking forward to tackling these next week.

It’s been a while

Hello!

My last blog post was done over a month ago and for the majority of that period I haven’t able to code all that much.  I have some very intense exams in April each year and so all of my free time is taken revising.  However over the last week I’ve managed to get back to where I want to be.  The free time gained from exams has gone straight into coding and, this weekend in particular, I’ve seen massive gains in knowledge/exposure.

FreeCodeCamp

This is the main source of learning for me now on.  My last post covered my basic Tribute page which was the first project in the freeCodeCamp basic front-end project portion.  The second task – my portfolio page – was put on hold as I felt that I didn’t know some of the key aspects required to actually complete it.  In hindsight I was wrong.  In the end I’ve come back to it and you can check it out here:

This is very simple at the moment, but covered the basics.  I had a few issues, mostly around positioning elements in the centre of the page, particularly on the click of the Nav bar as the section would always revert to the top.  However I’ve gathered some feedback on the 1st iteration which brought out some bigger problems, in particular how to scroll through the page rather than jump on the click of a link. This is still an issue at the moment however I will definitely be coming back to this project in the future as I look to implement much of the code for my full portfolio page.

In addition I completed the javascript and basic algorithm sections.  I enjoyed this as it was a good problem solving portion and it taught me much about how to address problems, formulate solutions and then document them in the code.  There were a couple of tricky challenges early on, but then I really got a head of steam and got through them at a quick pace.  So I was feeling pretty good about myself….

…until I met the JSON API intermediate front-end projects.  Man I can’t get this sorted.  I’m at the random quote generator and can’t get my data from the random quote API.  This has been my issue today and I just can’t seem to figure it out.  In the end I’ve abandoned it (and the other API projects) to go onto intermediate algorithms.  I know I should stick out with what I’m struggling with however I’ve been on that one API issue pretty much all day, I feel like I need to get away from it for a little bit and keep progressing.  Tomorrow I’ll take another look and see what I can do.  I bet it’s a semi-colon…

semicolon

Tech Events

It’s been a really intriguing week for me following my exam as there have been a lot of tech events in the city and I’ve managed to experience some of what’s out there.  I managed to get myself to see a coding event where contestants were shown jpeg of a famous website which they had to recreate in 15 mins.  This was intense!  They were all really impressive and showed a great talent for what they do.

I was also able to get myself along to a coding for beginners class where they brought you through the basics of Ruby.  We created a couple of very simple games, including a form of hangman.  It was really good to see and I was happy that I followed everything along and nothing went over my head.  This gave me encouragement to carry on with my studies and get as much done as possible.  And I look to continue this over the coming months.

The week also had some drop-in sessions where you could attend talks by local companies and take a tour of their offices.  For me not working in the industry this was very interesting.  It’s such a culture shock compared to my own industry which is much more strict/rigid/boring! It’s also really good to see how the professionals address problems they’re having and the experience gave me some good tips on how to progress (mostly about comments in the code!).

As previously mentioned, next on my list are the API projects. I really need to produce a good quality piece of work rather than just completing algorithms!  I’m on around day 9 of my 100 days of code challenge and in that time I’d like to complete the front-end portion of freeCodeCamp (I’m currently around 1/3 of the way in).  If I complete more then even better. If I can get through the first couple of APIs this week/weekend with a few more algorithms, then finish the rest off the week after I think I’ll be happy.

Onwards!

*PS If you’ve taken a  look at my codepen or have any advice on anything coding related I’d love to hear it!  Man I need some help…!

 

This is just a tribute…

…page.  It’s a Tribute page from freecodecamp.com, check it out! (it’s really basic…)

I’ve been away a while.  Last week I was on holiday and the week preceding a holiday is always manic in work, so coding was at a minimum over this period.  However I did find some time during my holidays to flit in and out of coding.  In particular, as you may have noticed, I’ve joined freecodecamp.com and started their Front-End Development course.

Right now, I’m very new to all this coding-malarky and I appreciate I have so much to learn before I can truly know what I like and what I don’t like.  My gut-feel is that I prefer back-end technologies more than front.  This is because I think my true talent lies in my technical ability rather than being more design orientated.  However that’s not to say that I don’t appreciate what goes to making a good front-end piece of code.  Although my initial stance is towards technologies such as Ruby on Rails, possibly Java, I think that I need a good grounding in front-end work first so I can then incorporate my later knowledge on this good base position.  During my initial work on CodeAcademy I found the HTML/CSS/Javascript courses much easier to follow.  Given that this is so new I don’t want to lose that motivation, so I’ve stuck on with front-end for now and am going to ride this wave!

surfs up

Why freecodecamp?  To be honest it looks pretty amazing.  I’ve read so many articles and seen so many youtube videos about the benefits of the freecodecamp curriculum so I thought I’d give it a go given I’d completed the other preview courses on other sites.  I felt very comfortable from the start given this was going over other material, but then the course veered away from CodeAcademy by introducing your own solo projects.  To me this is absolutely fantastic.  An opportunity for you to go on your own and make something from scratch, trying to incorporate all that you’ve learnt over the past few modules without guidance.  For this reason I would implore others to go for freecodecamp asap if you’re considering where to start.  Although I really feel I’ve benefited from all the previews I’ve taken which have led me here, if you know you want to learn html/css/javascript from the off then I’d recommend this.

The community at freecodecamp is incredible.  As soon as I published the link to my Tribute page (the first solo project in the front-end curriculum) I was able to get constructive feedback on what/why things were going wrong.  They really market this element too and actively encourage you to go to the chat section or the forums to look for advice/feedback on your projects.

At the moment I do feel a bit lost at times, mainly on what constitutes javascript/jquery, bootsrap/css. I mean…I wrote something I thought was css, then I got corrected on my code and said it was bootstrap…..I’m sure I’ll get there with experience.

Anyway, my Tribute page is very brief and definitely has some redundant parts in the code. that I’d like to go over.  In the draft of my page I wanted 3 photos aligned in a row.  I tried to use a class= ‘col-md-4’ definition following a class=’row’ div however this didn’t work.  Ultimately I was completely unable to adjust the size of my images.  I think this was because I was pulling the pictures form an external website, rather than the actual JPEG itself, so rather than download the images another website and link from there, I took the easier route and used one image!  As I noted, this was a brief go as I was a bit strapped for time, but I will definitely follow-up trying to figure out if I was right about my image resize issue.  The easier option is the route I would normally take, although at times I think I go further on the other side and struggle for too long on a topic before seeking help.  All pitfalls I’ve been reading about in beginner coders.  Another problem was with rounding of the images, however I have since learnt that this was because I used Bootstrap v3 terminology rather than v4.  Already falling behind on the times…!

My next project is to build a portfolio site.  This is another reason why I think freecodecamp is looking a really good investment of my time as it makes you create things of worth.  Although the code will be done through codepen.io I think it’s easy to copy across to properly employ your website.  I may be wrong!

After the portfolio site it’s back to the classroom with Javascript, Object-oriented and functional programming and then basic algorithms, which I’m really looking forward getting my teeth stuck into.

 

 

HTML/CSS – Done

Not quite…

I’ve completed the preview HTML & CCS course on Code Academy and overall I’m very happy with what I’ve learnt.  Editing classes of code so they all have a standard style, manipulating the box model,  through to setting background images and inserting tables – this was a good course to pick up the basics of HTML/CSS.

The course is very user-friendly and much easier to pick up than the Ruby course.  If I’d had my time over I would have started with this before moving onto Ruby later, just to get a taste of programming first.  But in the end it’s all good.  It was a good confidence boost to fully understand everything I was doing and seeing the big impact some simple changes can make to the format of a webpage.  I still feel like I understood the majority of the Ruby course, but I would definitely need to keep referring back if I were to ever move onto a Ruby project.  But that’s exactly how it’s supposed to be given I’m a complete novice.  So I’m on the right track at least…

Lots of notation in HTML/CSS are pretty intuitive, e.g. font-size sets….the…font….size.

dafuq-girl

There are some trickier things to consider, like the sizing of boxes in the box model, and how sizing can be set with regards to pixels, ems, or by relative percentage.  I’ve almost resigned to not learning hex colours – how can you even interpret those codes?!!!

When moving through the course you start to think how you would start such a project from scratch, and it really drives home the importance of planning.  Sketching out how you want your website to look and interact – I can see this saving a lot of time in the long run.  Failing to prepare and all that jazz…

I’ve caught the bug now.  It’s daunting at the start when you see over half a dozen languages being streamed off when you google “What do you need to become a web developer” but in reality I think there’s a lot of cross-over and it’s more about syntax differences.  To me it looks like you want to learn to program in general terms, and then the individual languages are just tools to help you get to that end point (but i could be very wrong!).

So HTML was the content.  CSS is the style of the content.  But it’s all very static at the moment.  The natural transition leads me to JavaScript.  So starting tomorrow I’ll be cracking on with the preview JavaScript module to get a taste of the most used language on the web (or so YouTube keeps telling me!).

I’ve also signed up to General Academy’s Dash project.  It’s a free course and provides instruction on making 5 different projects:

  • Building a personal website
  • Build a responsive blog theme
  • Build a small business website
  • Build a CSS robot
  • Build a madlibs game

I think once I’ve gone through JavaScript then this project will help to cement the knowledge I’ve gained over the past couple of weeks.  I’m hoping the course will teach how it’s all done from scratch and guide me through the process without too much spoon-feeding.  Code Academy was great to give you snippets of info and helpe you though those tasks, but now I’d like to really improve my knowledge with less hand-holding.

come-at-me-bro

 

HTML (& soon CSS)

Today I started learning HTML & CSS through Code Academy’s preview course.

This is going well.  It’s starting off really basic which is great for me as I’m a complete beginner.  The basis of the language seems very intuitive and easy to pick up *happy face*

In the course I learnt about “boilerplate code”.  This is the basis of the HTML coding structure – the minimum requirements in setting up HTML code.  This consists of:

  • Declaring the code as html
  • Then actually putting a <html> in the code so that the interpreter knows html code is coming.  The first step isn’t enough!
  • Having a <head> section which doesn’t affect the body of the page that you see , however…
  • …it can have a <title> which is the title shown in the tab heading in the web page
  • <body> is then your actually text shown on page.

Afterwards I progressed onto basic setup of content using headers (<h1>), paragraphs, anchors and using self-closing image notation.

I’ve absolutely missed out with this.  As a teenager I knew a few people who could make websites and they were like wizards! The basics are basic, and if even knowing that I could have been a wizard (Harry).

I’ve only just started the section on CSS but it was so powerful to see how it completely changes the dynamics of a webpage.  I’m sure this is very mundane to other novices out there but the example provided in the course did shock me.  It shows the impact CSS has on HTML content.

mind-blown

Such an amateur….