React component.

return (
            <div>
                <div data-aos='fade-right' className="front">
                    <div className="skills">
                        <h1>Front-End</h1>
                            <li>
                                <h3>HTML</h3><span className="bar"><span className="html"></span></span>
                            </li>
                            <li>
                                <h3>CSS</h3><span className="bar"><span className="css"></span></span>
                            </li>
                            <li>
                                <h3>JavaScript</h3><span className="bar"><span className="javascript"></span></span>
                            </li>
                            <li>
                                <h3>React</h3><span className="bar"><span className="react"></span></span>
                            </li>
                    </div>

                </div>
                <div className="back">
                </div>
            </div>
        );

CSS

* {
    font-family: sans-serif;
    list-style: none;
    padding: 0;
}

.skills {
    width: 500px;
    margin: 60px auto;
    color: black;
}

.skills li {
    margin: 20px 0;
}

.bar {
    background: #353B48;
    display: block;
    height: 2px;
    height: 2px;
    border-radius: 3px;
    overflow: hidden;
    box-shadow: 0 0 10px #2187e7b3;

}

.bar span {
    height: 2px;
    float: left;
    background: #2187e7;
}

.html {
    width: 90%;
    animation: html 2s;
}


@keyframes html {
    0% {
        width: 0%;
    }

    100% {
        width: 90%;
    }
}

.css {
    width: 60%;
    animation: css 2s;

}

.javascript  {
    width: 80%;
    animation: javascript 2s;

}

.react {
    width: 80%;
    animation: react 2s;

}


@keyframes css {
    0% {
        width: 0%;
    }

    100% {
        width: 60%;
    }
}
@keyframes javascript {
    0% {
        width: 0%;
    }

    100% {
        width: 80%;
    }
}
@keyframes react {
    0% {
        width: 0%;
    }

    100% {
        width: 80%;
    }
}