Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

Henrik Christensen
seal-mask
.a{fill-rule:evenodd;}techdegree
Henrik Christensen
Python Web Development Techdegree Student 38,322 Points

Question about react

Hi,

I got a question about the React Basic course.

What is the difference between:

var Something = React.createClass();

// and

function Something(props) {}

2 Answers

David ODey
David ODey
11,744 Points

I'm pretty new to React, but I believe the first one creates a component that would hold state, "smart component". The second one creates a component that would NOT hold state, "dumb component".

Hope this helps.

David ODey is right, but at the end of the day they are both functions that will effectively return React elements. Class Components just have a few extra tricks up their sleeves for managing state, using lifecycle hooks, and more.

According to the React docs 'Components and Props':

Components let you split the UI into independent, reusable pieces, and think about each piece in isolation.

Conceptually, components are like JavaScript functions. They accept arbitrary inputs (called "props") and return React elements describing what should appear on the screen.

Functional and Class Components

The simplest way to define a component is to write a JavaScript function... This function is a valid React component because it accepts a single "props" object argument with data and returns a React element. We call such components "functional" because they are literally JavaScript functions.