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.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s