Charts

Modern & Interactive Open Source Charts

Reviews

Design

Code

Reviews

You have full control to manage your own account setting.

Export To CSV...

Barry Watson

forHow to easily create a website with WordPress

I started at stage zero. With Geeks I was able to start learning online and eventually build up enough knowledge and skills to transition into a well-paying career.

Respond

Linda Shenoy

forGetting started - Grunt: The JavaScript Task...

Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Etiam vulputate euismod justo in consequat. Sed tempus elementum urnanisl et lacus.

Respond

Jean Watson

forGetting started - Vue js: The JavaScript Task...

Sed pretium risus magna, ac efficitur nunc rutrum imperdiet. Vivamus sed ante sed mi fermentum tempus. Nullam finibus augue eget felis efficitur semper.

Respond

John Deo

forGetting started - Gulp: The JavaScript Task...

Morbi quis posuere lacus. Morbi et metus sit amet tellus dapibus aliquam. Morbi consectetur magna vel turpis lobortis lorem iopsum dolor sit commodo.

Respond

Rubik Nanda

forGetting started - HTML: The Foundations Task...

Curabitur sollicitudin mi et sagittis egestas. Curabitur pellentesque nibh id enim hendrerit, at mollis neque rutrum. Sed nibh velit, tristique et dolor vitae.

Respond

Barry Watson

forHow to easily create a website with WordPress

Vestibulum in lobortis purus. Quisque sem turpis, hendrerit quis lacinia nec, rutrum nec velit. Nullam lobortis rhoncus tincidunt lorem ispun dnascetur ridiculus mus.

Respond

Jean Watson

forGetting started - Gulp: The JavaScript Task...

Praesent sit amet ornare magna, vitae consequat arcu. Vestibulum at dictum erat, a fringilla ante. Nam et nibh ut nunc rutrum suscipit quis non neque. Nulla facilisi.

Respond

Barry Watson

forGetting started - HTML: The Foundations Task...

Sed pretium risus magna, ac efficitur nunc rutrum imperdiet. Vivamus sed ante sed mi fermentum tempus. Nullam finibus augue eget felis efficitur semper.

Respond

// import node module libraries
import React from 'react';
import Link from 'next/link';
import { Card, Form, ListGroup, Row, Col } from 'react-bootstrap';

// import widget/custom components
import { FormSelect, InstructorReviewCard } from 'widgets';

// Import required data files
import { InstructorReviewsData as ReviewsData } from 'data/instructor/InstructorReviewsData';

export const Review1Example = () => {
    const courselist = [
        { value: '1', label: 'How to easily create a website' },
        { value: '2', label: 'Grunt: The JavaScript Task...' },
        { value: '3', label: 'Vue js: The JavaScript Task...' }
    ];
    const ratinglist = [
        { value: '1', label: '1' },
        { value: '2', label: '2' },
        { value: '3', label: '3' },
        { value: '4', label: '4' },
        { value: '5', label: '5' }
    ];
    const sortby = [
        { value: 'Newest', label: 'Newest' },
        { value: 'Oldest', label: 'Oldest' }
    ];

    return (
        <section className='p-4 bg-light rounded-3'>
            <Card className="border-0">
                <Card.Header className="d-lg-flex align-items-center justify-content-between">
                    <div className="mb-3 mb-lg-0">
                        <h3 className="mb-0">Reviews</h3>
                        <p className="mb-0"> You have full control to manage your own account setting.  </p>
                    </div>
                    <div>
                        <Link href="#" className="btn btn-outline-primary btn-sm">  Export To CSV... </Link>
                    </div>
                </Card.Header>
                <Card.Body>
                    <Form className="mb-4">
                        <Row>
                            <Col xl={6} lg={6} md={4} sm={12} className="mb-2 mb-lg-0">
                                <FormSelect options={courselist} placeholder="All" />
                            </Col>
                            <Col xl={3} lg={3} md={4} sm={12} className="mb-2 mb-lg-0">
                                <FormSelect options={ratinglist} placeholder="Rating" />
                            </Col>
                            <Col xl={3} lg={3} md={4} sm={12} className="mb-2 mb-lg-0">
                                <FormSelect options={sortby} placeholder="Sort" />
                            </Col>
                        </Row>
                    </Form>
                    <ListGroup variant="flush" className="border-top">
                        {ReviewsData.map((item, index) => (
                            <ListGroup.Item key={index} className="px-0 py-4">
                                <InstructorReviewCard item={item} />
                            </ListGroup.Item>
                        ))}
                    </ListGroup>
                </Card.Body>
            </Card>
        </section>
    );
}

Review Counter

Design

Code

How students rated this courses

4.12

(Based on 50 reviews)

48%

32%

10%

Reviews

Max Hawkins2 Days ago

Lectures were at a really good pace and I never felt lost. The instructor was well informed and allowed me to learn and navigate Figma easily.

Was this review helpful?

Yes No

Arthur WilliamsonDays ago

Its pretty good.Just a reminder that there are also students with Windows, meaning Figma its a bit different of yours. Thank you!

Was this review helpful?

Yes No

Claire Jones4 Days ago

Great course for learning Figma, the only bad detail would be that some icons are not included in the assets. But 90% of the icons needed are included, and the voice of the instructor was very clear and easy to understood.

Was this review helpful?

Yes No

Bessie Pena5 Days ago

I have really enjoyed this class and learned a lot, found it very inspiring and helpful, thank you!

Was this review helpful?

Yes No

// import node module libraries
import { Card, Form } from 'react-bootstrap';

// import widget/custom components
import { RatingProgressBar, ReviewCard } from 'widgets';

// import data files
import { Reviews } from 'data/courses/CourseIndexData';

export const Review2Example = () => {
    return (
        <section className='p-4 bg-light rounded-3'>
            <Card className="p-4 border-0">
                <div className="mb-3">
                    <h3 className="mb-4">How students rated this courses</h3>
                    <RatingProgressBar
                        totalFiveStart={24}
                        totalFourStart={16}
                        totalThreeStart={5}
                        totalTwoStart={2}
                        totalOneStart={3}
                    />
                </div>
                <hr className="my-5" />
                <div className="mb-3">
                    <div className="d-lg-flex align-items-center justify-content-between mb-5">
                        <div className="mb-3 mb-lg-0">
                            <h3 className="mb-0">Reviews</h3>
                        </div>
                        <div>
                            <Form className="form-inline">
                                <Form.Group className="d-flex align-items-center me-2" controlId="formBasicEmail" >
                                    <span className="position-absolute ps-3">
                                        <i className="fe fe-search"></i>
                                    </span>
                                    <Form.Control type="search" placeholder="Search Review" className=" ps-6" />
                                </Form.Group>
                            </Form>
                        </div>
                    </div>
                    {Reviews.map((item, index) => (<ReviewCard item={item} key={index} />))}
                </div>
            </Card>
        </section>
    );
}