Giter Site home page Giter Site logo

take-home-exercise's Introduction

Codelit Engineering Take-Home Exercise

๐Ÿ’ซ Welcome to the Codelit take-home coding exercise! ๐ŸŽ‰

This full-stack exercise involves building a form component in React that also makes a request to the Node.js/Express.js backend. We imagine you should spend around four hours at minimum to implement this feature, but want to emphasize that there is no specific deadline, or ticking clock for the implementation time. You can feel free to break the work up over multiple days. The entire point of this exercise is to get a good sense of how you build software.

Also, please keep in mind that you are not specifically limited to four hours. If you want to spend more time than that, using this as an opportunity to learn a new library or technology, or just generally making it more awesome, you are of course free to do so.

Getting Set Up

The exercise requires Node.js to be installed. We recommend using the LTS version.

  1. Start by cloning this repository.

  2. In the repo root directory, run npm install to gather all dependencies.

  3. Next, npm run seed will seed the local SQLite database. Warning: This will drop the database if it exists. The database lives in a local file database.sqlite3.

  4. Then run npm start which should start both the server and the React client.

โ—๏ธ Make sure you commit all changes to the master branch!

Technical Notes

  • The server is running with nodemon which will automatically restart for you when you modify and save a file.
  • The frontend was bootstrapped with Create React App
  • The database provider is SQLite, which will store data in a file local to your repository called database.sqlite3. The ORM Sequelize is on top of it. You should only have to interact with Sequelize.
  • The API client we have set up for you is axios. You are welcome to swap this out for your favorite client if you prefer.
  • The server is running on port 3001 and all AJAX requests from the frontend will automatically proxy to that endpoint. For instance, you can axios.get('/team') and it will automatically hit localhost:3001/team.

Acceptance Criteria

Below is a list of user stories corresponding to our acceptance criteria.

  1. I can click a button inside the empty "NEW TEAMMATE" card at the bottom that says 'Join the team!'.

  2. Clicking the 'Join the team!' button displays a form allowing me to fill out all of my team member information as per the data model (see backend/model.js).

  3. Filling out the form will create a new team member in the database that persists on reload.

  4. I can see team member cards for all of the new team members I have created.

Going Above and Beyond the Requirements

Given the time expectations of this exercise, we don't expect anyone to submit anything super fancy, but if you find yourself with extra time, any extra credit item(s) that showcase your unique strengths would be awesome! ๐Ÿ™Œ

Submitting the Assignment

When you have finished the assignment, create a bundle of your work by running npm run bundle in the repo root.

This generates a bundle file called take-home-exercise based on your local master branch. Return that file to us via e-mail, and we'll review your code within 1-2 days.

Thank you and good luck! ๐Ÿ™

take-home-exercise's People

Contributors

mo-sharif avatar deds3t 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.