DESCRIPTIVE-TITLE Solo Project

A repo made to test Semantic-UI-React's NPM that has a popup modal that display's necessary info.

Things learned:

• Learned how to make functionality for className "active" in navs and tabs
• Sharpened React JSX and CSS Flexbox skills.
• Learned how to combine two personal Solo Projects to make one dynamic project!

Overall, a productive project which allowed for better understanding of Pop Up Modals.

Preview of work done:

Image of Pop-up-Bar displaying dynamic info and picures

Image of the Pop-up-Bar's integrated and dynamic Carousel

KEY NOTES: ONLYADDIFYOUNEEDDISCLAIMERS!!!

• The first Carousel was made with Bootstrap NPM
• The second Carousel was made with Alice-Carousel NPM in a Class Component
• The third Carousel was made with Alice-Carousel NPM in a Function Component

Steps to recreate:

In console:

npm install semantic-ui-react semantic-ui-css

npm i react-alice-carousel

Add these lines to the App.js file:

import {
  Checkbox,
  Sidebar,
} from 'semantic-ui-react';
import AliceCarousel from 'react-alice-carousel';

import 'semantic-ui-css/semantic.min.css';
import 'react-alice-carousel/lib/alice-carousel.css';

Choose any example code from the Docs here and adjust to the best fit.

https://react.semantic-ui.com/usage

Life

https://www.npmjs.com/package/react-alice-carousel