antonio-ramadas/palbum

Refactor App.js

Open

#7 opened on Mar 12, 2019

View on GitHub
 (0 comments) (0 reactions) (0 assignees)JavaScript (0 forks)auto 404
frontendgood first issue

Repository metrics

Stars
 (9 stars)
PR merge metrics
 (PR metrics pending)

Description

App.js is doing more than it should. It populates the page (search bar and table).

However, whenever there is an update to the list (e.g., a new album is added) the whole component is rendered. As you can guess, there is no need for it.

Also, with a refactor, the logic would no longer be on a single file and its size will most likely be reduced.

I suggest having one component for the search bar, another for the table and App.js simply calls them on the rendermethod.

Contributor guide

Research direction
Break down App.js into separate components: one for the search bar and one for the table. Then, in App.js, simply render these components. This will improve maintainability and reduce unnecessary re renders.
Tech stack
javascriptreact
Domain
frontend
Issue type
Refactor
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
2
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
Half day
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
Active
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
Clear
Prerequisites
ReactJavaScript
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
80