DEV Community

Cole
Cole

Posted on

5 3

(React)ion news : Easy As Pie

So I've been busy.
I've learned the basics of react, created a tutorial app, and re-did one of my past applications in react.

Its actually really easy. I LOVE react hooks.
From the outset, it seemed really confusing.
But once you realize how they work, you won't be able to stop using it.

Here is the component from my redone application.

import {useState} from "react";
import './quotes.css';
function Quote() {
    let [quoteText, setQuote] = useState("");
    function getText()
        {try{
            fetch('https://ron-swanson-quotes.herokuapp.com/v2/quotes')
            .then(response => response.json())
                .then((data) => setQuote(data));
            }
            catch(err){
                console.log(err);
            }
        }
    return (
        <div className="MainDiv">
            <header className="quote-header">
            <h1>Random Swanson Quotes</h1>
                <div className="row">
                    <div className="col">
<button onClick={() =>getText(quoteText)}>Sage Wisdom</button>
                    < hr/>
                        </div>  
                    </div>
                <div class="row" id="mainrow">
                <div class="col-sm-12" id="quote">
            <p id="quoteBlock">{quoteText}</p>
        </div>
        </div>
        </header>
    </div>
    );}
export default Quote
Enter fullscreen mode Exit fullscreen mode

From this, I've discovered that my biggest issue is getting ahead of myself.
Especially when learning new tech, I put the cart before the horse and then wonder why I haven't moved.

But now, I create micro apps to become adjusted with the language, and grow with the language from there.

I highly recommend React to any beginners. Once you learn it, its a very helpful tool.

Hostinger image

Get n8n VPS hosting 3x cheaper than a cloud solution

Get fast, easy, secure n8n VPS hosting from $4.99/mo at Hostinger. Automate any workflow using a pre-installed n8n application and no-code customization.

Start now

Top comments (0)

Billboard image

Create up to 10 Postgres Databases on Neon's free plan.

If you're starting a new project, Neon has got your databases covered. No credit cards. No trials. No getting in your way.

Try Neon for Free →

👋 Kindness is contagious

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

Okay