├── public ├── favicon.ico ├── logo192.png ├── logo512.png ├── robots.txt ├── manifest.json └── index.html ├── src ├── Images │ ├── logo.webp │ ├── image1.jpg │ ├── image2.jpg │ ├── image3.jpg │ ├── image4.jpg │ ├── image5.jpg │ └── wallpaper.jpg ├── setupTests.js ├── App.test.js ├── reportWebVitals.js ├── home.css ├── index.js ├── App.css ├── App.js ├── index.css ├── logo.svg ├── Pages │ ├── Home.js │ ├── Works.js │ ├── Letter.js │ ├── Review.js │ ├── Categories.js │ └── Courses.js └── Components │ ├── Navbar.js │ └── Footer.js ├── .gitignore ├── package.json └── README.md /public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Mikasha0/SkillUp-/HEAD/public/favicon.ico -------------------------------------------------------------------------------- /public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Mikasha0/SkillUp-/HEAD/public/logo192.png -------------------------------------------------------------------------------- /public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Mikasha0/SkillUp-/HEAD/public/logo512.png -------------------------------------------------------------------------------- /src/Images/logo.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Mikasha0/SkillUp-/HEAD/src/Images/logo.webp -------------------------------------------------------------------------------- /public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /src/Images/image1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Mikasha0/SkillUp-/HEAD/src/Images/image1.jpg -------------------------------------------------------------------------------- /src/Images/image2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Mikasha0/SkillUp-/HEAD/src/Images/image2.jpg -------------------------------------------------------------------------------- /src/Images/image3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Mikasha0/SkillUp-/HEAD/src/Images/image3.jpg -------------------------------------------------------------------------------- /src/Images/image4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Mikasha0/SkillUp-/HEAD/src/Images/image4.jpg -------------------------------------------------------------------------------- /src/Images/image5.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Mikasha0/SkillUp-/HEAD/src/Images/image5.jpg -------------------------------------------------------------------------------- /src/Images/wallpaper.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Mikasha0/SkillUp-/HEAD/src/Images/wallpaper.jpg -------------------------------------------------------------------------------- /src/setupTests.js: -------------------------------------------------------------------------------- 1 | // jest-dom adds custom jest matchers for asserting on DOM nodes. 2 | // allows you to do things like: 3 | // expect(element).toHaveTextContent(/react/i) 4 | // learn more: https://github.com/testing-library/jest-dom 5 | import '@testing-library/jest-dom'; 6 | -------------------------------------------------------------------------------- /src/App.test.js: -------------------------------------------------------------------------------- 1 | import { render, screen } from '@testing-library/react'; 2 | import App from './App'; 3 | 4 | test('renders learn react link', () => { 5 | render(); 6 | const linkElement = screen.getByText(/learn react/i); 7 | expect(linkElement).toBeInTheDocument(); 8 | }); 9 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /src/reportWebVitals.js: -------------------------------------------------------------------------------- 1 | const reportWebVitals = onPerfEntry => { 2 | if (onPerfEntry && onPerfEntry instanceof Function) { 3 | import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => { 4 | getCLS(onPerfEntry); 5 | getFID(onPerfEntry); 6 | getFCP(onPerfEntry); 7 | getLCP(onPerfEntry); 8 | getTTFB(onPerfEntry); 9 | }); 10 | } 11 | }; 12 | 13 | export default reportWebVitals; 14 | -------------------------------------------------------------------------------- /src/home.css: -------------------------------------------------------------------------------- 1 | .wallpaper .logo{ 2 | width: clamp(70px, 100vw, 120px); 3 | height: auto; 4 | } 5 | .navbar-scrolled{ 6 | background-color: #0A2357; 7 | } 8 | /* #home .card .card-body{ 9 | display: flex; 10 | justify-content:space-around; 11 | align-items:center; 12 | } 13 | @media (max-width: 767px) { 14 | #home .card .card-body { 15 | display: block; 16 | justify-content: center; 17 | width: 50%; 18 | margin: 0 auto; 19 | } 20 | #home .card .card-body h1{ 21 | align-items: center; 22 | } 23 | } */ -------------------------------------------------------------------------------- /src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom/client'; 3 | import './index.css'; 4 | import App from './App'; 5 | import reportWebVitals from './reportWebVitals'; 6 | 7 | const root = ReactDOM.createRoot(document.getElementById('root')); 8 | root.render( 9 | 10 | 11 | 12 | ); 13 | 14 | // If you want to start measuring performance in your app, pass a function 15 | // to log results (for example: reportWebVitals(console.log)) 16 | // or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals 17 | reportWebVitals(); 18 | -------------------------------------------------------------------------------- /public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /src/App.css: -------------------------------------------------------------------------------- 1 | .App { 2 | text-align: center; 3 | } 4 | 5 | .App-logo { 6 | height: 40vmin; 7 | pointer-events: none; 8 | } 9 | 10 | @media (prefers-reduced-motion: no-preference) { 11 | .App-logo { 12 | animation: App-logo-spin infinite 20s linear; 13 | } 14 | } 15 | 16 | .App-header { 17 | background-color: #282c34; 18 | min-height: 100vh; 19 | display: flex; 20 | flex-direction: column; 21 | align-items: center; 22 | justify-content: center; 23 | font-size: calc(10px + 2vmin); 24 | color: white; 25 | } 26 | 27 | .App-link { 28 | color: #61dafb; 29 | } 30 | 31 | @keyframes App-logo-spin { 32 | from { 33 | transform: rotate(0deg); 34 | } 35 | to { 36 | transform: rotate(360deg); 37 | } 38 | } 39 | -------------------------------------------------------------------------------- /src/App.js: -------------------------------------------------------------------------------- 1 | import Navbar from "./Components/Navbar"; 2 | import Home from "./Pages/Home"; 3 | import Footer from "./Components/Footer"; 4 | import Works from "./Pages/Works"; 5 | import Categories from "./Pages/Categories"; 6 | import Letter from "./Pages/Letter"; 7 | import Courses from "./Pages/Courses"; 8 | import Review from "./Pages/Review"; 9 | import { BrowserRouter } from "react-router-dom"; 10 | 11 | function App() { 12 | return ( 13 |
14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 |
23 | 24 |
25 | ); 26 | } 27 | 28 | export default App; 29 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "skill-up", 3 | "version": "0.1.0", 4 | "private": true, 5 | "dependencies": { 6 | "@testing-library/jest-dom": "^5.16.5", 7 | "@testing-library/react": "^13.4.0", 8 | "@testing-library/user-event": "^13.5.0", 9 | "phosphor-react": "^1.4.1", 10 | "react": "^18.2.0", 11 | "react-dom": "^18.2.0", 12 | "react-router-dom": "^6.6.1", 13 | "react-router-hash-link": "^2.4.3", 14 | "react-scripts": "5.0.1", 15 | "web-vitals": "^2.1.4" 16 | }, 17 | "scripts": { 18 | "start": "react-scripts start", 19 | "build": "react-scripts build", 20 | "test": "react-scripts test", 21 | "eject": "react-scripts eject" 22 | }, 23 | "eslintConfig": { 24 | "extends": [ 25 | "react-app", 26 | "react-app/jest" 27 | ] 28 | }, 29 | "browserslist": { 30 | "production": [ 31 | ">0.2%", 32 | "not dead", 33 | "not op_mini all" 34 | ], 35 | "development": [ 36 | "last 1 chrome version", 37 | "last 1 firefox version", 38 | "last 1 safari version" 39 | ] 40 | } 41 | } 42 | -------------------------------------------------------------------------------- /src/index.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 0; 3 | /* background-image: url(/src/Images/wallpaper.jpg); */ 4 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 5 | 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 6 | sans-serif; 7 | -webkit-font-smoothing: antialiased; 8 | -moz-osx-font-smoothing: grayscale; 9 | } 10 | 11 | code { 12 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 13 | monospace; 14 | } 15 | .bb:hover{ 16 | transform: scale(1.01); 17 | transition: 0.5s; 18 | box-shadow: 0px 0px 10px 5px #e9e4e5; 19 | } 20 | /* .card:hover{ 21 | transition: 0.5s; 22 | box-shadow: 0px 0px 10px 5px #e9e4e5; 23 | } */ 24 | .wallpaper{ 25 | background-image: url(./Images/wallpaper.jpg); 26 | background-size: cover; 27 | } 28 | .inner{ 29 | overflow: hidden; 30 | } 31 | .inner img{ 32 | transition: all 1.3s ease; 33 | width: 100%; 34 | } 35 | .inner:hover img{ 36 | overflow: hidden; 37 | transform: scale(1.2); 38 | } 39 | .contact-button:hover{ 40 | transition: 0.7s; 41 | color:#61CE70; 42 | } 43 | .hover{ 44 | background-color: #61CE70; 45 | } 46 | .hover:hover{ 47 | transition: 1.5s; 48 | background-color: green; 49 | } 50 | /* .carousel-inner{ 51 | display: flex; 52 | } 53 | .carousel-item{ 54 | display: block; 55 | margin-right: 0; 56 | flex: 0 0 calc(100%/3) */ 57 | /* .card-title { 58 | color: #db0075; 59 | } 60 | .card-text { 61 | color: #17E6E6; 62 | } 63 | .list-inline-item { 64 | color: #ffd700 65 | } 66 | .price { 67 | color: #9B1B30; 68 | } 69 | .btn-pink { 70 | background-color: #fcb2b2 !important; 71 | } */ 72 | 73 | .carousel-control-prev-icon{ 74 | background-color: green; 75 | width: 6vh; 76 | height: 6vh; 77 | border-radius:50%; 78 | transform: translate(-50%); 79 | } 80 | .carousel-control-next-icon{ 81 | background-color: green; 82 | width: 6vh; 83 | height: 6vh; 84 | border-radius:50%; 85 | transform: translate(-50%); 86 | } -------------------------------------------------------------------------------- /public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 12 | 13 | 17 | 18 | 27 | 33 | React App 34 | 35 | 36 | 37 |
38 | 48 | 53 | 54 | 55 | -------------------------------------------------------------------------------- /src/logo.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/Pages/Home.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import "../home.css"; 3 | // import logo from "../Images/logo.webp"; 4 | 5 | export default function Home() { 6 | return ( 7 |
8 |
9 |
10 |
11 |
12 |

16 | 23 | LISTEN TO OUR NEW ANTHEM 24 | {" "} 25 |

26 |

30 | Find The Most Exciting Online Coueses. 31 |

32 |

36 | Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed 37 | eiusmod tempor incididunt labore dolore magna aliqua. 38 |

39 |
40 | 44 | 50 |
51 |
52 |
53 |
54 |
55 | {/*
64 |
65 |
73 | .. 74 | 75 |

coursera

76 |
77 | 78 |

Udemy

79 |
80 | 81 |

unacademy

82 |
83 |
84 |
85 |
*/} 86 |
87 |
88 | ); 89 | } 90 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Getting Started with Create React App 2 | 3 | This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app). 4 | 5 | ## Available Scripts 6 | 7 | In the project directory, you can run: 8 | 9 | ### `npm start` 10 | 11 | Runs the app in the development mode.\ 12 | Open [http://localhost:3000](http://localhost:3000) to view it in your browser. 13 | 14 | The page will reload when you make changes.\ 15 | You may also see any lint errors in the console. 16 | 17 | ### `npm test` 18 | 19 | Launches the test runner in the interactive watch mode.\ 20 | See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information. 21 | 22 | ### `npm run build` 23 | 24 | Builds the app for production to the `build` folder.\ 25 | It correctly bundles React in production mode and optimizes the build for the best performance. 26 | 27 | The build is minified and the filenames include the hashes.\ 28 | Your app is ready to be deployed! 29 | 30 | See the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information. 31 | 32 | ### `npm run eject` 33 | 34 | **Note: this is a one-way operation. Once you `eject`, you can't go back!** 35 | 36 | If you aren't satisfied with the build tool and configuration choices, you can `eject` at any time. This command will remove the single build dependency from your project. 37 | 38 | Instead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you're on your own. 39 | 40 | You don't have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn't feel obligated to use this feature. However we understand that this tool wouldn't be useful if you couldn't customize it when you are ready for it. 41 | 42 | ## Learn More 43 | 44 | You can learn more in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started). 45 | 46 | To learn React, check out the [React documentation](https://reactjs.org/). 47 | 48 | ### Code Splitting 49 | 50 | This section has moved here: [https://facebook.github.io/create-react-app/docs/code-splitting](https://facebook.github.io/create-react-app/docs/code-splitting) 51 | 52 | ### Analyzing the Bundle Size 53 | 54 | This section has moved here: [https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size](https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size) 55 | 56 | ### Making a Progressive Web App 57 | 58 | This section has moved here: [https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app](https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app) 59 | 60 | ### Advanced Configuration 61 | 62 | This section has moved here: [https://facebook.github.io/create-react-app/docs/advanced-configuration](https://facebook.github.io/create-react-app/docs/advanced-configuration) 63 | 64 | ### Deployment 65 | 66 | This section has moved here: [https://facebook.github.io/create-react-app/docs/deployment](https://facebook.github.io/create-react-app/docs/deployment) 67 | 68 | ### `npm run build` fails to minify 69 | 70 | This section has moved here: [https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify](https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify) 71 | -------------------------------------------------------------------------------- /src/Components/Navbar.js: -------------------------------------------------------------------------------- 1 | import React, { useEffect } from "react"; 2 | import { SignIn } from "phosphor-react"; 3 | import { HashLink as Link } from "react-router-hash-link"; 4 | import "../home.css"; 5 | 6 | export default function Navbar() { 7 | useEffect(() => { 8 | const navEl = document.querySelector(".navbar"); 9 | 10 | window.addEventListener("scroll", () => { 11 | if (window.scrollY > 65) { 12 | navEl.classList.add("navbar-scrolled"); 13 | } else if (window.scrollY < 65) { 14 | navEl.classList.remove("navbar-scrolled"); 15 | } 16 | }); 17 | }); 18 | 19 | return ( 20 |
21 | 109 |
110 | ); 111 | } 112 | -------------------------------------------------------------------------------- /src/Pages/Works.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import wallpaper from "../Images/wallpaper.jpg"; 3 | import image1 from "../Images/image1.jpg"; 4 | import image2 from "../Images/image2.jpg"; 5 | 6 | export default function Works() { 7 | return ( 8 |
12 |
13 |
14 |
15 |

16 | How It Works? 17 |

18 |
19 |

23 | Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed 24 | do eiusmod tempor incididunt ut labore et dolore magna aliqua. 25 | Ut enim ad minim veniam. 26 |

27 |
28 |
29 |
30 |
35 |
36 |
37 |
38 |
39 |
40 |
41 |
42 | ... 43 |
44 |
Find Courses
45 |

46 | We have helped over 3,400 new students to get into 47 | the most popular tech teams. 48 |

49 |
50 |
51 |
52 |
53 |
54 |
55 |
56 | ... 57 |
58 |
Book Your Seat
59 |

60 | We have helped over 3,400 new students to get into 61 | the most popular tech teams. 62 |

63 |
64 |
65 |
66 |
67 |
68 |
69 |
70 | ... 71 |
72 |
Get Certificate
73 |

74 | We have helped over 3,400 new students to get into 75 | the most popular tech teams. 76 |

77 |
78 |
79 |
80 |
81 |
82 |
83 |
84 |
85 |
86 |
87 |
88 | ); 89 | } 90 | -------------------------------------------------------------------------------- /src/Components/Footer.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | 3 | export default function Footer() { 4 | return ( 5 | 108 | ); 109 | } 110 | -------------------------------------------------------------------------------- /src/Pages/Letter.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import wallpaper from "../Images/wallpaper.jpg"; 3 | import image1 from "../Images/image1.jpg"; 4 | import image2 from "../Images/image2.jpg"; 5 | import { Clock } from "phosphor-react"; 6 | 7 | export default function Letter() { 8 | return ( 9 |
10 |
11 |
12 |
13 |

14 | Latest News & Articles 15 |

16 |
17 |

21 | Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do 22 | eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut 23 | enim ad minim veniam. 24 |

25 |
26 |
27 |
28 |
33 |
34 |
35 |
36 |
37 |
38 |
39 | 40 | 100%x280 41 |
42 |
43 | Accounting 44 |
45 | Let's Know How Skillup Work Fast and Secure? 46 |
47 |

48 | Lorem ipsum dolor sit amet, consectetur adipiscing 49 | bla blabla... 50 |

51 |
52 | ... 58 |

April 9,2022

59 | 64 |
65 |
66 |
67 |
68 |
69 |
70 | 100%x280 71 |
72 |
73 | Accounting 74 |
75 | How To Improve Digital Marketing For Fast SEO 76 |
77 |

78 | Lorem ipsum dolor sit amet, consectetur adipiscing 79 | blabla bla... 80 |

81 |
82 | ... 88 |

April 9,2022

89 | 94 |
95 |
96 |
97 |
98 |
99 |
100 | 100%x280 101 |
102 |
103 | Accounting 104 |
105 | How To Register & Enrolled on SkillUp Step by Step? 106 |
107 |

108 | Lorem ipsum dolor sit amet, consectetur adipiscing 109 | bala baula... 110 |

111 |
112 | ... 118 |

April 9,2022

119 | 124 |
125 |
126 |
127 |
128 |
129 |
130 |
131 |
132 |
133 |
134 |
135 | ); 136 | } 137 | -------------------------------------------------------------------------------- /src/Pages/Review.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import wallpaper from "../Images/wallpaper.jpg"; 3 | import image1 from "../Images/image1.jpg"; 4 | import image2 from "../Images/image2.jpg"; 5 | import { Star } from "phosphor-react"; 6 | 7 | export default function Categories() { 8 | return ( 9 |
14 |
15 |
16 |
17 |

18 | Our Students{" "} 19 | 20 | Reviews 21 | 22 |

23 |
24 |

28 | Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed 29 | do eiusmod tempor incididunt ut labore et dolore magna aliqua. 30 | Ut enim ad minim veniam. 31 |

32 |
33 |
34 |
35 |
40 |
41 |
42 |
43 |
44 |
45 |
46 | ... 57 |
58 |
Abinash Rai
59 |

63 | FrontEnd Developer 64 |

65 | 72 | 77 | 5.0 78 | 79 |
80 |
81 |
82 |

83 | Lorem ipsum dolor sit amet, consectetur adipiscing 84 | elit, sed do eiusmod tempor incididunt ut labore 85 | et dolore magna aliqua. Ut enim ad minim veniam. 86 |

87 |
88 |
89 |
90 |
91 |
92 |
93 | ... 104 |
105 |
Aniket Tamrakar
106 |

110 | FullStack Developer 111 |

112 | 119 | 124 | 5.0 125 | 126 |
127 |
128 |
129 |

130 | Lorem ipsum dolor sit amet, consectetur adipiscing 131 | elit, sed do eiusmod tempor incididunt ut labore 132 | et dolore magna aliqua. Ut enim ad minim veniam. 133 |

134 |
135 |
136 |
137 |
138 |
139 |
140 | ... 151 |
152 |
Aryan Shakya
153 |

157 | BackEnd Developer 158 |

159 | 166 | 171 | 5.0 172 | 173 |
174 |
175 |
176 |

177 | Lorem ipsum dolor sit amet, consectetur adipiscing 178 | elit, sed do eiusmod tempor incididunt ut labore 179 | et dolore magna aliqua. Ut enim ad minim veniam. 180 |

181 |
182 |
183 |
184 |
185 |
186 |
187 |
188 |
189 |
190 |
191 |
192 | ); 193 | } 194 | -------------------------------------------------------------------------------- /src/Pages/Categories.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import wallpaper from "../Images/wallpaper.jpg"; 3 | import image1 from "../Images/image1.jpg"; 4 | import image2 from "../Images/image2.jpg"; 5 | import image3 from "../Images/image3.jpg"; 6 | import image4 from "../Images/image4.jpg"; 7 | import image5 from "../Images/image5.jpg"; 8 | 9 | export default function Categories() { 10 | return ( 11 |
12 |
13 |
14 |
15 |

16 | Select Your{" "} 17 | 23 | Categories 24 | 25 |

26 |
27 |

31 | Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do 32 | eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut 33 | enim ad minim veniam. 34 |

35 |
36 |
37 |
38 |
43 |
44 |
45 |
46 |
47 |
51 |
52 | ... 63 |
64 |
Development
65 |

66 | 1 Courses 67 |

68 |
69 |
70 |
71 |
72 |
73 |
77 |
78 | ... 89 |
90 |
Marketing
91 |

92 | 3 Courses 93 |

94 |
95 |
96 |
97 |
98 |
99 |
103 |
104 | ... 115 |
116 |
Accounting
117 |

118 | 2 Courses 119 |

120 |
121 |
122 |
123 |
124 |
125 |
129 |
130 | ... 141 |
142 |
IT & Software
143 |

144 | 4 Courses 145 |

146 |
147 |
148 |
149 |
150 |
151 |
155 |
156 | ... 167 |
168 |
Web Design
169 |

170 | 2 Courses 171 |

172 |
173 |
174 |
175 |
176 |
177 |
181 |
182 | ... 193 |
194 |
Medical
195 |

196 | 1 Courses 197 |

198 |
199 |
200 |
201 |
202 |
203 |
204 |
205 |
206 |
207 |
208 |
209 |
210 | ); 211 | } 212 | -------------------------------------------------------------------------------- /src/Pages/Courses.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import wallpaper from "../Images/wallpaper.jpg"; 3 | import image1 from "../Images/image1.jpg"; 4 | import image2 from "../Images/image2.jpg"; 5 | import image3 from "../Images/image3.jpg"; 6 | import image4 from "../Images/image4.jpg"; 7 | import image5 from "../Images/image5.jpg"; 8 | import { Clock, VideoCamera, User } from "phosphor-react"; 9 | 10 | export default function Letter() { 11 | return ( 12 |
13 |
14 |
15 |
16 |

17 | Explore Featured Courses 18 |

19 |
20 |

24 | Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do 25 | eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut 26 | enim ad minim veniam. 27 |

28 |
29 |
30 |
31 |
36 |
37 |
38 |
39 |
40 |
41 |
45 | 100%x280 50 |
51 |
52 | 60 | Development 61 | 62 |
63 | Let's Know How Skillup Work Fast and Secure? 64 |
65 | 70 |

77 | 12 Weeks 78 |

79 | 84 |

92 | 2 Lessons 93 |

94 | 99 |

18 Enrolled

100 |
101 |
102 | Free 103 |
104 | 114 |
115 |
116 |
117 |
118 |
119 |
123 | 100%x280 124 |
125 |
126 | 134 | IT & Security 135 | 136 |
137 | How To Improve Digital Marketing For Fast SEO 138 |
139 | 144 |

151 | 12 Weeks 152 |

153 | 158 |

166 | 2 Lessons 167 |

168 | 173 |

18 Enrolled

174 |
175 |
176 | Free 177 |
178 | 188 |
189 |
190 |
191 |
192 |
193 |
197 | 100%x280 198 |
199 |
200 | 208 | Finance & Accounting 209 | 210 |
211 | How To Register & Enrolled on SkillUp Step by Step? 212 |
213 | 218 |

225 | 12 Weeks 226 |

227 | 232 |

240 | 2 Lessons 241 |

242 | 247 |

18 Enrolled

248 |
249 |
250 | Free 251 |
252 | 262 |
263 |
264 |
265 |
266 |
267 |
271 | 100%x280 272 |
273 |
274 | 282 | Photography 283 | 284 |
285 | How To Register & Enrolled on SkillUp Step by Step? 286 |
287 | 292 |

299 | 12 Weeks 300 |

301 | 306 |

314 | 2 Lessons 315 |

316 | 321 |

18 Enrolled

322 |
323 |
324 | Free 325 |
326 | 336 |
337 |
338 |
339 |
340 |
341 |
345 | 100%x280 346 |
347 |
348 | 356 | Health & Fitness 357 | 358 |
359 | How To Register & Enrolled on SkillUp Step by Step? 360 |
361 | 366 |

373 | 12 Weeks 374 |

375 | 380 |

388 | 2 Lessons 389 |

390 | 395 |

18 Enrolled

396 |
397 |
398 | Free 399 |
400 | 410 |
411 |
412 |
413 |
414 |
415 |
419 | 100%x280 420 |
421 |
422 | 430 | Networking 431 | 432 |
433 | How To Register & Enrolled on SkillUp Step by Step? 434 |
435 | 440 |

447 | 12 Weeks 448 |

449 | 454 |

462 | 2 Lessons 463 |

464 | 469 |

18 Enrolled

470 |
471 |
472 | Free 473 |
474 | 484 |
485 |
486 |
487 |
488 |
489 |
490 |
491 |
492 |
493 |
494 |
495 | ); 496 | } --------------------------------------------------------------------------------