Git Product home page Git Product logo

challenge-fullstack's Introduction

Full-Stack Take-Home Challenge

peek-graphql-ember

At Peek, we build software for tour and activity operators to run their businesses. One essential feature to almost all of our operators on PeekPro is the back office calendar where they can go to schedule activities, view rental bookings and see how many of their guests are arriving in a given day, week, or month.

On our frontend team, we love EmberJs. On the backend we love Elixir, we are also big fans of GraphQL. We like the benefits it provides over a classical REST API, including the strong typing, the flexibility for the client to request exactly what they need, and the automatic documentation.

You can learn more about GraphQL, Ember and elixir from the official getting started guide at graphql.org/learn emberjs.com/guides elixir-lang.org

For this challenge, we would like for you to add two small features to an app we have prepared for you. Whether you are new to Ember/Elixir or an expert, we hope you'll enjoy jumping right in without having to deal with the scaffolding of the new apps. The domain and challenges are similar to the types of problems we have had to solve here at Peek, and we believe working on this challenge will give insight into the types of technical tasks you might face as a full-stack developer here.

Expected Time & Effort

We don't want you to have to take too much time with this challenge and ask that you do not spend more than 4 hours.

The Sample Project

The sample project you will build upon has both an Ember app and an Elixir app.

The Ember app has

  • a GraphQL call wired up hitting the provided elixir app retrieving a bunch of "events"
  • a route already setup to display events

The Elixir app has

  • an Event + Booking schema defined
  • a seed script you can run to populate some sample events
  • a GraphQL query to list events
  • a test written to show the query returns results
  • a context function written create_booking that will add a booking to a given event id.

Problem Description

  • In the ember app, display the events in a one day calendar view in a way that looks like a day of google calendar.
  • Add the ability to add a "booking" to an event. This will require writing a new Mutation in Elixir that wires up the create_booking context function created for you.

Extras

At a minimum, we ask the above be implemented. Extra points for the following:

  • Filters when retrieving events
  • UI for multiple days
  • Querying bookings and displaying them
  • [Anything else you think would make for a cool experience]

You can use this stack for your implementation

The client folder is setup to use Emberjs and apollo-ember-client library for graphql. The server app is setup to use Elixir with Phoenix framework and Absinthe for graphql. We at peek use postgreSQL and is included in the docker-compose if you want to use it

Server Setup

With docker, You can run the server by running: (create, migrate, seeding in done in entrypoint.sh)

cd server
docker-compose build
docker-compose up

To make changes to the server, it is easier to run it locally. You will need to have hex/postgres/phoenix installed to run the following commands. To start your Local Phoenix server:

  • Install dependencies with mix deps.get
  • Compile the project and its dependencies with mix compile
  • Create and migrate your database with mix ecto.setup (alternatively you can also run mix ecto.create mix ecto.migrate and seeds events with mix run priv/repo/seeds.exs)
  • Start Phoenix endpoint with mix phx.server

The app is expecting PGHOST to be set in an system var or defaults to localhost. Depending of your config you might need to export PGHOST or update some values. You can find the config used here: server/config/config.exs

When this is running you should be able to go to: http://localhost:4000/graphiql and try to query a list of events Gql main endpoint is available at: http://localhost:4000/api/ CORS is enabled for http://localhost:4200/ (ember default url). If needed you can update CORS in server/lib/peek_web/router.ex

Client

You will need the following things properly installed on your computer.

Local Installation:

  • cd client
  • yarn
  • npm install -g ember

Running / Development

Code Generators Make use of the many generators for code, try ember help generate for more details

How to submit your code

You can fork our repo and create your own branch and send us a link to it. Please make sure visibility is set to public so we can access that link. You can also submit a zip files with the code challenge.

Learn more

Learn more about Phoenix/Elixir:

Learn more about Ember:

Learn more about some tools:

Question?

If you have any questions, do not hesitate at all to ask ([email protected]).

challenge-fullstack's People

Contributors

jstoobz avatar martinbeuriot avatar thonydam avatar

Stargazers

 avatar

Watchers

 avatar

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.