DEV Community

Cover image for The making of SmartBasket
KarenJParker77 for The Collab Lab

Posted on

The making of SmartBasket

I tend to listen to podcasts while I’m in the car 🚗

It passes the time, right?

One morning I was listening to a woman being interviewed. She mentioned having been a mentor on a scheme for early career developers called The Collab Lab (TCL). Run as a non-profit, she explained, TCL invites applications from people across the world who have learnt some HTML, CSS, Javascript and React, either by completing a bootcamp or as a self-taught dev.

TCL teaches the skills that a bootcamp may not teach, but that are just as important; how we as developers collaborate within our teams – communication skills, pair programming, using GitHub, writing and reviewing pull requests and explaining our code to others.

Right there, I was sold on participating in TCL, and eagerly awaited the opportunity to apply.

So, how does it work?

TCL runs a number of cohorts at certain points throughout the year, with each cohort being made up of four early-career developers. Cohorts are predominantly based in North America but TCL sometimes runs cohorts in European and African time zones too, and we were one of those, with devs in the UK and Nigeria, and a brilliant support team based in Greece, Germany and the Netherlands.

A screenshot of our our team

Our cohort was

Const devs = [Cassandra, Mike, Sandra, Karen]
Const mentors = [Peter, Eva, Aristos, Ayu]
Enter fullscreen mode Exit fullscreen mode

and our mentors were
Peter, Aristos, Eva and Ayu.

Kicking off

The Collab Lab begins with all of the cohorts getting together for a kick-off meeting with the driving forces behind TCL, Andrew and Stacie, running us all through the expectations and processes.

For us, that was at 4pm on a Saturday afternoon – a very respectable hour of the day on our continents, but much less so, we learned for some of our fellow TCL members over the pond! ☕

At this first meeting, it’s immediately striking how passionate, energetic, and supportive everyone is, in spite of the early hour for some. Everyone is just delighted to be there and the enthusiasm is infectious.

It’s also clear at this point – and as we go through the eight weeks – that TCL’s resources are seriously high quality. From the onboarding info, to the starter code, to the presentations and other material that goes alongside TCL, it’s meticulous, well thought out and pitched at just the right level to be both supportive and challenging.

Over the eight weeks of TCL, the aim is to work together to develop a smart shopping app in React. We take turns to pair programme with a different team mate each week, and work together on one pre-determined issue that has been set for us. The issues began gently (thanks TCL!) but quickly we were tackling coding that challenged us. The beauty of it being if one of us didn't know how to approach an issue, more often than not, the other person in the pair had an inkling of where to start, or at least what to google 😅 And of course our mentors were there as a friendly safety net.

A section of code

A weekly timetable

Each week we joined an hour-long sync meeting with the rest of our team and our mentors. The sync followed the same format each week. Firstly, the pairs demonstrated what they’d worked on. It’s so beneficial to practice talking about code and the decisions you’d made in a safe (ie, not a job interview!) space, and to hear others doing the same.

Some weeks there were learning modules, and some weeks we had a retrospective session to review how we had collaborated, what we’d done well, and how we could improve. Just like a real team of developers 😉

Finally, the tasks for the next week were allocated, and then it was over to us to achieve the task for the week. Time management was key; we needed to deliver the functionality but also allow time for both people in the other pair to review our work and provide comments, for us to do the same for their work, and then to get our mentors’ sign off.

Introducing SmartBasket

So, as mentioned, each TCL cohort works together to create a smart shopping app, using React for the front end and Firestore behind the scenes. It’s worth mentioning that the final two weeks of TCL are a little more freestyle in terms of what’s to be achieved. By that point, the app should pretty much be functioning and the final stage is agreeing and implementing a look for it. We chose to use Tailwind CSS for our styling.

The list page in the SmartBasket app

  • You can check out our Github repo here

  • Our completed, deployed project here

  • and finally here is our final sync, including the presentation of the app.

A word on our mentors

We all agreed that our mentors Aristos, Eva and Peter were great. They kept us on track, and in amongst their own jobs as senior devs, illness, exams and well, life, they were always there to guide us. Their positivity, technical knowledge and attention to detail really was second to none and inspired us all.

Each cohort also has a designated code of conduct rep. Ayu was ours and it was her responsibility to ensure we all felt safe and sound as we took part, and that everyone had a positive experience. Ayu checked in with us during the eight weeks and was friendly and super encouraging.

Thank you to you all 💚

All in all...

... a really excellent experience, highly recommended to anyone wanting to break in to the tech industry!

Top comments (0)