DEV Community


Posted on


(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()
            .then(response => response.json())
                .then((data) => setQuote(data));
    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 class="row" id="mainrow">
                <div class="col-sm-12" id="quote">
            <p id="quoteBlock">{quoteText}</p>
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.

Top comments (0)

Visualizing Promises and Async/Await 🤯

async await

Learn the ins and outs of Promises and Async/Await!