vinitshahdeo/PortScanner

Timer Component in React

Ouverte

#120 ouverte le 8 mars 2021

Voir sur GitHubGuide contributeur
 (13 commentaires) (0 réaction) (2 personnes assignées)Python (122 forks)auto 404
Level3Reactfrontendgssoc21help wantedup for grabs

Métriques du dépôt

Stars
 (150 étoiles)
Métriques de merge PR
 (Aucune PR mergée en 30 j)

Description

As we've built many features to justify the one-liner description of this project i.e. a go-to networking tool, now it's time to revamp the existing UI.

Add a new component Timer.js which will be enabled once the user starts scanning( scan button is clicked). Refer the image attached below for design.

As of now, create a button Timer in the Timer.js component along with the timer. The timer should start when Timer button is clicked

P.S. : The basic frontend on react is available on feature/react branch in the folder network-scanner. Add your components in the same branch. Do not make any changes in App.js / index.js.

image

Guide contributeur

Direction de recherche
Créez un nouveau composant Timer avec un bouton qui démarre un minuteur. Utilisez l'état React et setInterval pour implémenter la fonctionnalité de minuteur. Ajoutez le composant au frontend existant dans la branche 'feature/react' sans modifier App.js ou index.js.
Stack technique
reactjavascript
Domaine
frontend
Type d'issue
Fonctionnalité
DifficultéDifficulté estimée pour un nouveau contributeur, de 1 pour un très petit changement à 5 pour un travail expert.
1
Temps estiméFourchette de temps approximative pour investiguer, implémenter, tester et préparer une pull request.
Moins d'une heure
Statut d'activitéDisponibilité apparente de l'issue : fraîche, active, ancienne, bloquée ou en attente d'un mainteneur.
Active
ClartéClarté avec laquelle l'issue explique le changement attendu, les critères d'acceptation et la prochaine étape.
Claire
Prérequis
React
Accessibilité débutantScore de 1 à 100 estimant l'accessibilité de cette issue pour un premier contributeur.
85