DEV Community

Cover image for My 2nd Project | Day 7
Jayant
Jayant

Posted on

 

My 2nd Project | Day 7

So I have made a Dice Game πŸ‘‡

React Project

It have 3 Compnent

App

Rolldice

Die

Die Component Consists of a Die which is rendered on the type of props passed.

In the Rolldice Component we Have 2 Die and a Button.

Whenever we click the button it will call a Function that Randomly give the value and change the values of state and then I pass the state as a props in the Die Component.

Code link πŸ‘‡

https://github.com/Developer-io-web/Dice-Excercise

Things learnt by Doing This Project β†’

  1. How to use the Font-awesome Icons in your React Project

    To start using them we 1st have to install some packages.

    npm i --save @fortawesome/fontawesome-svg-core
    npm install --save @fortawesome/free-solid-svg-icons
    npm install --save @fortawesome/react-fontawesome
    

    Then u have to Import them into each Component.

    import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
    import { <icon-name> } from '@fortawesome/free-solid-svg-icons'
    import { <icon-name> } from '@fortawesome/free-brands-svg-icons'
    

    U can use them like this πŸ‘‡

    <FontAwesomeIcon icon="<icon-name>" />
    
  2. Method which calls the function after a particular time.

    1. setTimeout: calls a function once after a particularized delay.
    2. setInterval: calls a function repeatedly, beginning after some time, then repeating continuously at the given interval.

    I actually know about them earlier but doesn’t know the difference about them.

    Syntax:

    **SetTimeout**

    setTimeout(()=>{
        console.log('Repeat once after  1 second.')
    },1000);
    

    setInterval

    setInterval(()=>{
        console.log('Repeat after every one minute');
    },)
    

Top comments (1)

Collapse
 
nftcryptomix profile image
nftcryptomix

Cool I will do this project once I finish a few more basic projects, thanks for the share.

Visualizing Promises and Async/Await 🀯

async await

☝️ Check out this all-time classic DEV post