Giter VIP home page Giter VIP logo

usercentric's Introduction

Usercentric GitHub

Made with ❤ by Bruno Finger

Usercentric GitHub is my solution to a challenge proposed by a company as part of their recruiting process.

The challenge consisted of creating an application which moves the focal point of GitHub from the repositories and codes, to the user and their interactions.

These are the proposed requirements:

  • The list of contributors to all Angular repositories. The ranking should be sortable by amount of contributions made by developer to all repositories, by amount of followers, public repos & gists he/she published;
  • The details page of each contributor with all repositories he contributed to and his details;
  • The repository details page where we can find other contributors.

The developed application implements all three above requirements, and:

  • Not only the Angular organization repositories, but it also supports showing the same level of details for any given organization;
  • When the User has their location set, the application will try to geolocate the data using the OpenStreetMaps Nominatim API and display it using a Leaflet component with OSM layer;
  • The application implements I18N, that means it is translatable. The following languages are implemented and usable within the app: English (US) and Portuguese (BR). Other languages can easily be implemented by extending one of the strings.json files.
  • There is an asynchronous search bar which will simultaneously display users and organizations based on the input, and once clicking on a result, will redirect to the correct view within the application for that specific kind of data. The search bar implements a debounce rate to avoid overflowing the search API and exceed the maximum amount of API requests limit.
  • The application internally cache some of the API calls to avoid making too many requests;
  • The application also has a somewhat responsive layout, though it wasn't the primary focus of this implementation.

The technological stack in use is:

  • AngularJS 1.5;
  • Angular Material;
  • OSM and Leaflet;
  • Babel (for transpiling ES6 into ES5);
  • Gulp;
  • SASS/SCSS;
  • More details can be found in the package.json file.

To locally visualize the solution, follow the instructions below:

First, make sure you have all the dependencies installed locally, those would be:

  • Python 3
  • Git
  • NodeJS 9
  • Yarn

If on Ubuntu/Debian-based distros or Ubuntu for Windows 10, simply run the setupEnv.sh script in a bash shell, and it should take care of it for you.

Then, simply run yarn start. It should make the source code ready and start a local web server running on port 8080.

There's a live demo at https://usercentric.brunofinger.xyz as well.

usercentric's People

Contributors

brunofin avatar

Watchers

 avatar  avatar

usercentric's Issues

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.