Code Monkey home page Code Monkey logo

algolia-technical-test's Introduction

Algolia technical test

This project is made for the technical test part of the Algolia hiring process.

The original requirements can be found at requirements.md.

Frontend

Components

This project uses several Vue components. All of them are prefixed with al-. You need to either directly nest the other components in an al-search or supply the :al-search attribute.

Styling is opinionated and makes use of Tachyons.

al-search

props: app-id='XCG7JJBBFK' api-key='e3d622501fbbe065394049f746b16314' facets='["category"]'

A component that deals with the Algolia integration. Usually you'll wrap this around the other components. If that's not the case, then you will have to pass a reference to this al-search as a prop to each of the other components.

al-input

props: :al-search='alSearch'

An input that will search over your specified al-search.

al-facet

props: name='category' :al-search='alSearch'

A component that allows you to filter over a certain facet. Take in account that you need to give an array of facets to the relevant al-search.

al-sort

props: :options='options' :al-search='alSearch'

Allows you to pick a different index to search in.

options can for example be:

[{
  index: 'appstore_rating_asc',
  name: 'Rank ascending'
}, {
  index: 'appstore_rating_desc',
  name: 'Rank descending'
}]

al-stats

props: :al-search='alSearch'

A component that shows the amount of hits and the amount of time needed for the latest result.

al-result

props: :result='result'

Render a single search result.

al-pagination

props: :al-search='alSearch'

Render and handle pagination functions.

al-results

props: :al-search='alSearch'

A component that includes stats, results and pagination.

Backend

The backend is written in Express and has two main routes. Static routes, which are in /controllers/index.js and API routes, which are in /controllers/api/.

API v1

The API route 1/index.js contains two methods:

  • POST /api/1/apps with a JSON body this will be added to the appstore Algolia index.
  • DELETE /api/1/apps/:id will delete the object with that idea at the appstore Algolia index.

Setup

The api routes require an Algolia Admin API Key you can find on algolia.com/api-keys. This should be set as the environment variable ALGOLIA_API_KEY. Other API keys are at controllers/api/1/index.js and src/App.vue.

algolia-technical-test's People

Contributors

haroenv avatar

Stargazers

 avatar

Watchers

 avatar  avatar  avatar

algolia-technical-test's Issues

Components via webpack

Currently I load the components into the html directly, and not as ES6 modules that are imported when necessary. If I'd change that I'll have to use webpack, but then I can also depend on certain Tachyons modules in each of the components.

What I think is a disadvantage of this is that webpack isn't always too streamlined to work with, and will have a higher file size, because it needs to deal with things like circular dependencies and dependency dedups.

Which is why I'll keep it like this now.

Finished?

If so, awesome, just confirm it via email :)

[tracking]

  • MVC
  • algolia post adds
  • algolia delete deletes
  • search
  • pagination
  • faceting
  • sort by rank (algolia slaves)
  • components used for frontend
    • divide in components
    • components in separate files
  • looks good
  • document the structure
  • deploy on Heroku

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.