<The Northcoders Blog />


All Posts

Anat's Experience: Learning React with Northcoders

After an intense week of DOM manipulation, I'm now on Week 9 at Northcoders' Coding Bootcamp - and that only meant one thing: React!

Northcoders teach React for 2 weeks (at the moment - the curriculum is updated a lot!) - this blog is about my experience of the first week of learning it!


In case you're new to the DOM, it defines the logical structure of HTML (and XML) as well as the the way you can manipulate and access elements of the DOM. And this all made sense - although it seemed a little clunky!

The Answer

Luckily, we were soon to be shown the light - React! It was so strange going from clunky DOM manipulation to React, which rendered all of your components - your buttons, sections, pages - all into a single element! 

We spent the first week getting to grips with the basics of React and the all-important components, states, and props. Make no mistake - it was a learning curve.

But why did I struggle through and learn React in the first place? It was not hard to see that Northcoders is all about teaching the skills and languages that the industry wants. In fact, I found out that learning the DOM is brand new to the curriculum after feedback from industry experts and hiring managers.

Day 1 

Our first day of React began with one of the longest lectures on the course - there was a lot of new content and new concepts! I felt excited - it seemed very slick compared to what we'd done before, but there were definitely concepts I'd need to try out myself before it really made sense.

The first day was a one-off: a day without pair programming, to help us try and get to grips with how different React was to DOM. This was invaluable; I couldn't have imagined trying to explain to a pair how we could pass functions as props from one component down to another and make the state of the first component change! To manoeuvre our way through React 101, we made To-Do lists, the 'Hello World' of Front-End. Day 1 was about learning and seeing as many of the possible pitfalls and errors we could run into as possible!


Days 2 - 3 

Next, we made 'Tiny Apps' - lots of different mini applications such as emoji-filters, random word-generators, calculators... all things that we foolishly thought wouldn't be too difficult...! This sprint gave us more exposure and confidence with state, props, components and classes and, most importantly, how to organise the components in our apps.

We were back to pair programming for most of this sprint, and all I can say is Pair Pair Pair whenever you can! It's so easy to fall into bad habits when you're exploring something new, like making all of your components classes because you don't yet understand why some things need to be classes and some not. 

Days 4 - 5 

At the beginning of the week, we had no idea how to use React whatsoever. Yet by Day 4 we were pairing to make copies of websites we knew - in our case, Twitter, using the Twitter API to pull real data from the real Twitter!

First, we learnt about the miraclulous Webpack which allowed us to make full use of ES6, which we've all become fond of, seeming slick and neat compared to the slightly older ES5!

This sprint really taught us the importance of component and state organisation - things got pretty messy when I wanted to change the state in the profile component from the timeline one. Luckily, the tutors were on hand to unravel the mess and help us understand how to approach the problem! I don't think we've ever Tweeted "Is this working..?" so many times from our accounts...

It was also an opportunity to explore the component lifecycle that we'd learned about in lectures. For this sprint, we used the lifecycle to fetch the relevant data whilst the components mounted, so that all the relevant Tweets could be rendered when the time came!

A Powerful Technology

Wow - React - so slick especially when compared to manipulating the DOM with the DOM API! I really enjoyed learning React with Northcoders, and after my second week of it I felt really confident building dynamic web apps with it.

Get on board and become a confident Software Developer - check out the Northcoders coding bootcamp here!

Anat Dean
Anat is a Northcoder In Residence. After being awarded a #WomenInTech Scholarship sponsored by EY, we were taken aback her immense learning pace and natural aptitude - and she now mentors our current students.

Related Posts

An update from our CEO: What's next? Helping our graduates find work

This is a message from Chris Hill, CEO of Northcoders. He explores what's next for Northcoders, and how w...
Chris Hill 25 June 2020

Job Hunting Tips For Bootcamp Graduates? Recent Graduate Judit Weighs In

I have been asked to write about my experience of looking for a job as a fresh coding bootcamp graduate i...
Judit Lehoczki 11 June 2020

20 Ways to Look After Your Mental Health During Lockdown

The outbreak of COVID-19 is a hugely challenging time for looking after our mental health. During Mental ...
Ruth Ng 19 May 2020