DEV Community

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

Posted on

3 1

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');
    },)
    

Postmark Image

Speedy emails, satisfied customers

Are delayed transactional emails costing you user satisfaction? Postmark delivers your emails almost instantly, keeping your customers happy and connected.

Sign up

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.

A Workflow Copilot. Tailored to You.

Pieces.app image

Our desktop app, with its intelligent copilot, streamlines coding by generating snippets, extracting code from screenshots, and accelerating problem-solving.

Read the docs

πŸ‘‹ Kindness is contagious

Please leave a ❀️ or a friendly comment on this post if you found it helpful!

Okay