Skip to content

Grab Front End Guide

A study guide to the modern front end stack, written by Grab's web team for newcomers.grab/front-end-guide

Stars
15.2k
Forks
1.1k
Licence
MIT
Language
JavaScript
Last update
3.4 years ago
Type
Learning resource

No commits in over a year — check for forks or alternatives before adopting.

What it is

This is a written study plan from Grab's web team that explains the modern JavaScript front end ecosystem. It covers topics such as single-page apps, React, Redux, CSS Modules, linting, testing, build tools, and deployment. It is aimed at engineers new to front end work and explains why Grab chose certain tools, with links to learning resources.

  • Read the table of contents and work through topics in order to learn the stack
  • Use the recommended libraries as a checklist when evaluating a front end setup
  • Compare Grab's chosen tools with the listed alternatives for different use cases
  • Share the guide with new team members during onboarding

Great for

  • Back end engineers joining a team that works on web apps
  • New front end developers who feel overwhelmed by the number of tools
  • Teams exploring a modern JavaScript stack who want a starting point to adapt
  • Students who want a structured reading order for front end topics

Not ideal for

  • Experienced front end developers who already follow current practices, since the guide says it will probably not be useful to them
  • Readers looking for runnable code or a software project to install, because this is a guide rather than a library or app
  • Anyone needing up-to-date tool recommendations, since the last push was June 2023 and the guide says it is updated periodically
Step-by-step guide: how to use Grab Front End GuideInstall, first run, examples, tips and FAQs

How to get it

  1. 1

    Read it online

    Clone the repository

    git clone https://github.com/grab/front-end-guide
  2. 2

    Run it

    • Open the repository on GitHub or clone it locally.
    • Read the Pre-requisites section to check whether you are ready.
    • Start with Single-page Apps and follow the table of contents in order.
    • Follow the linked study resources for any topic you want to go deeper on.
  3. 3

    Get the most out of it

    • Work through the Study Links after each section to reinforce concepts.
    • Skip topics you already know, as the guide says certain topics can be skipped.
    • Compare the recommended tools with the alternatives the guide lists for your own project needs.
    • Check the Table of Contents for the testing, linting, and types sections if your team needs code quality practices.

Downloads

Strengths

  • Explains the reasoning behind each tool choice, not just the choice itself
  • Points to learning resources so readers can continue on their own
  • Written for newcomers and states its own prerequisites clearly

Trade-offs

  • Some recommendations may be dated given the last update in the metadata
  • Mostly reading material with no runnable examples in the portion provided
  • Opinionated toward choices made at Grab, though it offers alternatives

How it compares

ProjectStarsTypeLevelUpdatedBest for
front-end-guide (this)15.2kLearning resourcebeginner3.4 years agoBack end engineers joining a team that works on web apps
front-end-interview-handbook44kLearning resourcebeginner1 months agoEngineers preparing for front end job interviews
fe-interview26.3kLearning resourcebeginner1.0 years agoFront-end developers preparing for job interviews
js-stack-from-scratch20.1kLearning resourceintermediate2.4 years agoDevelopers who already know JavaScript basics and want to understand how a React and Node setup is put together
lint-staged14.8kDev toolintermediate6 days agoJavaScript or Node.js projects that already use tools like ESLint or Prettier
TW-Elements13.2kLibraryintermediate7 months agoDevelopers already using Tailwind CSS who want prebuilt interactive components

Stats synced from GitHub. The assessment above was drafted with AI from the project's README on 2026-10-29 and may miss recent changes — check the README before relying on a command. MIT licence: free to use, modify and distribute, including commercially, as long as you keep the copyright notice.