Skip to content

Instantly share code, notes, and snippets.


Chhavi chhavijustme

View GitHub Profile
chhavijustme /
Last active Aug 20, 2018
GSoC Final Evaluation

Brief Description of the Project

MusicBrainz is aiming for a user experience overhaul. To keep development and design in sync, we are building a UI component library. The components are written in react.js, and documented using react-storybook.

Tasks Accomplished

Selecting a UI Component Library

I compared various open source libraries out there to select one suitable for our purposes. We finally decided to go with react-bootstrap because of three main reasons:

  1. All basic components required for development are available.
  2. The community support for developers is amazing.
  3. Our other project, BookBrainz already utilizes react-bootstrap.
View gist:fc4fc4234ec40229f712f10e455c4140
import React, { Component } from 'react';
import { Button } from 'react-bootstrap';
import '../../App.css';
import '../../css/bootstrap.min.css';
class ButtonBlock extends Component {
render() {
const wellStyles = { maxWidth: 400, margin: '0 auto 10px' };
return (
chhavijustme /
Last active Jan 22, 2018
Game Plan for Redesign of MetaBrainz

We are on our way to have a castle of pixel perfect pretty mockups. Will that castle be but an illusion? Sorry, for being so dramatic. What I am trying to say is, we need a plan on how to build it. And here are just some of my thoughts about it 😄

Our present game plan and all that is wrong with it

  • Have the mockups ready
  • Then someone, with some knowledge of how code works, will slice it up into tickets.
  • Design-person coordinates on making sure every ticket owner has what he/she/zhe needs. Hey, where do I get this font? Is this the latest icon set?
  • Design-person crosschecks when it’s done. It goes up and live.
  • Someone finds we used a different button somewhere. We have a ticket. Which then needs to be taken up by someone. And before we know it, we have huge piles of UX-debt. I feel this is a very probably scenario, seeing the huge scale of projects we have.
You can’t perform that action at this time.