React Mock Interview Practice

This is a repository I made for watching a React Mock Interview via Youtube. I watched it first then tried to solve the problem on my own. The website is not responsive.

Table of Contents

• Challenge
• Screenshot
• Link
• What I Learned
• Further Development
• Resources
• Author

Challenge

• Create 6 cute kitten cards from the data provided
• Year of age should be correct
• Create cards using grid

Screenshot

Link

• Mock Junior Front End Web Developer Interview with Mike Chen and Silvia

What I learned

• It's always good to practice and voice out your thought patterns while coding
• Never be afraid to ask questions when you get stuck
• Use good HTML semantics
• Application of slice method on a real project:

const MAX_CATS = 6;
const App = () => {
  return (
    <section className="App">
      {CATS.slice(0, MAX_CATS).map((cat) => {
        return <Card {...cat} />;
      })}
    </section>
  );
};

Further Development

• You can make the website responsive by collapsing the grid
• More UX/UI design
• Use API for more or real live data

Resources

• CSS Grid Layout
• React Docs

Author

• Website - Ash Moreno
• Twitter - @sexy_gravy