# Functional component in React

**URL:** <https://forum.kirupa.com/t/functional-component-in-react/649980>\
**Category:** web dev\
**Created:** [December 12, 2021, 1:10pm UTC](https://forum.kirupa.com/t/functional-component-in-react/649980 "2021-12-12T13:10:42Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![not\_survivng](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/not_survivng/32/16225_2.png) [@not\_survivng](https://forum.kirupa.com/u/not_survivng)\
**Post date:** [December 12, 2021, 1:10pm UTC](https://forum.kirupa.com/t/functional-component-in-react/649980/1 "2021-12-12T13:10:42Z")

</div>

I’m new to react and need to learn the Functional components with Yahtzee game but all i can find with that game are class components. :")  
Can anyone please refactor one example of it to a functional version of Yahtzee game?  
if someone can do so that I can use it as a reference, i will be very thankful!  
one example of what I’m looking for :  
[Demo](https://yahtzee-ado.netlify.app/)

[Code](https://github.com/AdoDragicevic/yahtzee)

---

<div class="post-metadata">

**Author:** ![kirupa](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/kirupa/32/11616_2.png) [@kirupa](https://forum.kirupa.com/u/kirupa)\
**Post date:** [December 12, 2021, 4:05pm UTC](https://forum.kirupa.com/t/functional-component-in-react/649980/2 "2021-12-12T16:05:40Z")

</div>

What have you tried so far? Functional components in React can often be straightforward to convert from a class syntax. Here is a short refresher: [Stateless Functional Components](https://www.kirupa.com/react/functional_components.htm)

If you are just starting with this conversion, one tip is to start small and convert each class components individually and make sure your app still works.

😀

---

<div class="post-metadata">

**Author:** ![not\_survivng](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/not_survivng/32/16225_2.png) [@not\_survivng](https://forum.kirupa.com/u/not_survivng)\
**Post date:** [December 12, 2021, 8:40pm UTC](https://forum.kirupa.com/t/functional-component-in-react/649980/3 "2021-12-12T20:40:40Z")

</div>

That’s the thing, i did try but i keep receiving errors, that’s why i want a full version so i can figure out where im going wrong.

---

<div class="post-metadata">

**Author:** ![kirupa](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/kirupa/32/11616_2.png) [@kirupa](https://forum.kirupa.com/u/kirupa)\
**Post date:** [December 12, 2021, 9:41pm UTC](https://forum.kirupa.com/t/functional-component-in-react/649980/4 "2021-12-12T21:41:58Z")

</div>

Can you post the version you tried?

Also, this earlier post seems similar to what you are looking for: [Refactoring a class component to Functional, Invalid value](http://forum.kirupa.com/t/refactoring-a-class-component-to-functional-invalid-value/649866)