Code Monkey home page Code Monkey logo

jammming's People

Watchers

avatar

jammming's Issues

Summary - Feature Request

Rubric Score

Criteria 1: Objective

  • Score Level: 4/4 (Exceeds Expectations)
  • Comment(s): Your objective is a great one. Being able to start a search by pressing enter on the keyboard is a common UX pattern. Nice work!

Criteria 2: Background

  • Score Level: 4/4 (Exceeds Expectations)
  • Comment(s): Your background section is great! It provides a detailed explanation of the pain point this feature is addressing. You also gave a good summary of the overall functionality of the feature within the app. Really awesome work!

Criteria 3: Technical Design

  • Score Level: 4/4 (Exceeds Expectations)
  • Comment(s): You did a good job with this. You gave a good summary of what component would be changed and exactly how you would change it. Great job recognizing that you could modify the search component and reuse a lot of the existing code that was already there. Nice work!

Criteria 4: Caveats

  • Score Level: 4/4 (Exceeds Expectations)
  • Comment(s): You showed that you put thought into the feature and what problems might arise, or what alternate methods you might be able to use to implement the feature. You had a great discussion regarding the different events you could possibly listen for when a key is actually being interacted with. You also showed good thought when discussing component complexity. Really great work!

Overall Score: 16/16

Overall, you did a good job with this feature request. You chose a feature that would greatly improve the UX of the app and explained the necessity for this feature clearly and concisely.
Your implementation details were well thought out and explained thoroughly. Good work!

Summary

Rubric Score

Criteria 1: CRA Project Creation & Structure

  • Score Level: 4/4 (Exceeds Expectations)
  • Comment(s): Your file structure is good. You made a CRA app and all of the components are properly located inside of folders, with the file paths working as well. Nice work!

Criteria 2: Data Flow

  • Score Level: 4/4 (Exceeds Expectations)
  • Comment(s): You met the requirements for data flow within the app. You did well working with Spotify and showed good understanding of how it worked. Your search functionality was well done and your playlist manipulation was also great. Nice work!

Criteria 3: Syntax

  • Score Level: 4/4 (Exceeds Expectations)
  • Comment(s): You hit upon all of the syntax requirements here. You used className when applying classes and used JSX instead of pure HTML. You added a reset.css properly and keys to each of the tracks in your track list. Lastly, you wrote elegant code for adding and removing the tracks. Be careful to avoid direct state mutation. In your addTrack method, you are actually directly manipulating state because you are not copying the array you access from state. Due to this, you are modifying that array in place when you push a new track. Next time, try copying the array with a spread operator and modifying the copy, then write back to state with that modified copy. Other than that, nice work!

Criteria 4: DRY Code/Style

  • Score Level: 4/4 (Exceeds Expectations)
  • Comment(s): You did well keeping your code "DRY." One thing I would recommend to enhance it would be to move the base API url into its own variable. This will allow you to replace the base url if the domain every changes for whatever reason. Other than that, nice job!

Overall Score: 16/16

Overall, you did a great job with this project. You implemented all of the features of the project and wrote "DRY" code. Your data flow through the app was great and you did a good job working with the Spotify API. A lot of learners experience trouble when working with Spotify, so it is great to see that you were able to get it. Other than watching for direct state mutation, awesome work!

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.