GraphQL Key Concepts

What is GraphQL?
GraphQL is a query language for APIs – not databases. In that sense it’s database agnostic and effectively can be used in any context where an API is used. It fetches data from a server where that data is stored in a database.

Why is GraphQL considered better then REST?
– REST too inflexible to keep up with the rapidly changing requirements of the clients that access them
– more flexibility and efficiency needed
– With a REST API, you would typically gather the data by accessing multiple endpoints
– In GraphQL on the other hand, you’d simply send a single query to the GraphQL server that includes the concrete data requirements.

Continue reading →

GraphQL + React, Apollo, GraphCool

I completed the tutorial How to GraphQL, it’s a great tutorial to understand GraphQL. You get to build a Hackernews clone with React, Apollo (caching GraphQL client), GraphQL and GraphCool (GraphQL backend). Choose a different stack if you’d like, there’s options in the tutorial.

This is the Hackernews app I built using the tutorial. I’m so glad that GraphQL exists, you don’t need ten different HTTP endpoints for every data retrieval or manipulation, just one does the job. I can’t believe I haven’t been using this, I’m so happy with it.

A simple illustration from the tutorial (https://www.howtographql.com) that demonstrates how it’s simpler (and better) than REST API..

Data Fetching with REST API

Data Fetching with GraphQL

freeCodeCamp Intermediate & Advanced Front End Projects

I completed freeCodeCamp Intermediate & Advanced Front End Projects – they’re absolutely my favourite part of the course. There’s 4 projects utilising APIs from Google Maps, Twitch, OpenWeather and Wikipedia. Also, 4 projects that’s simple games or tools – Pomodoro timer, Calculator, Tic tac toe and Simon game. If you’d like to take a look at the mini apps and games I’ve completed, view them in my portfolio.

 

UI / Front End – Sketch, Zeplin, Slim, Modular CSS with Sass, Flexbox

So there’s this guy who’s learning to code, Robert and me had remote mentorship from an awesome senior dev, Emile who introduced some great tools and technologies to us.

Sketch

Sketch is a Mac app that’s similar to Photoshop Illustrator but even better for UI design.

Zeplin

Export Sketch designs into Zeplin and grab CSS values from this web app, great for collaboration with team members.

Slim

It’s like Haml but slimmer (lol). Slim reduces the syntax that you would usually write in full-form HTML.

Modular CSS with Sass (taken from Emile’s lesson plan)

Continue reading →