├── .gitignore ├── README.md ├── package-lock.json ├── package.json ├── public ├── favicon.ico ├── images │ ├── Development-pana.png │ ├── Microsoft.png │ ├── React.png │ ├── bootstrap.png │ ├── c-sharp.png │ ├── c.png │ ├── cpp.png │ ├── css.png │ ├── html.png │ ├── js.png │ ├── nomad-amico.png │ ├── nomad-bro.png │ ├── python.png │ └── sql-server.png ├── index.html ├── logo192.png ├── logo512.png ├── manifest.json ├── portfolio-images │ ├── m-01.png │ ├── m-02.png │ ├── m-03.png │ ├── n-01.png │ ├── n-02.png │ ├── n-03.png │ ├── n-04.png │ ├── resume-1.jpg │ ├── resume-2.jpg │ ├── resume-3.jpg │ ├── resume-4.jpg │ ├── solo-01.png │ ├── solo-02.png │ ├── solo-03.png │ ├── solo-04.png │ ├── tour-01.png │ ├── tour-02.png │ ├── tour-03.jpg │ ├── tour-04.jpg │ ├── tour-05.jpg │ ├── w-01.png │ ├── w-02.png │ └── w-03.png └── robots.txt └── src ├── App.css ├── App.js ├── App.test.js ├── components ├── About.js ├── Home.js ├── MyWork.js ├── Resume.js ├── Sidebar.js └── Skills.js ├── index.css ├── index.js ├── reportWebVitals.js └── setupTests.js /.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 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # React Portfolio, Multiple pages 2 | 3 | ## Features 4 | 5 | • Multi-Page Layout 6 | 7 | • Modern Design 8 | 9 | • React-Icons 10 | 11 | • Illustrations 12 | 13 | ## How to use 14 | 15 | ① fork the repository and clone locally 16 | 17 | ② run `npm install` to install dependencies 18 | 19 | ③ once installation is complete, run `npm run start` to get your local copy running in the browser. 20 | 21 | ## Template instructions 22 | 23 | ① Replace the Images 24 | 25 | • In public folder there are two folders for images. Replace those images with yours and if your image have different name then you need to change the src of img tag in particular component 26 | 27 | ② edit App.css 28 | 29 | • In App.css follow the instructions for color theme and font family 30 | 31 | ③ Replace Informations 32 | 33 | • In all components you need to replace my information with your's. 34 | 35 | • Replace Name, About, Skills, Resume, My Works 36 | 37 | • Replace my contact information links with your's inside Sidebar component 38 | 39 | • If you want to replace Icons then visit: https://react-icons.github.io/react-icons/ 40 | 41 | 42 | ## Illustrations 43 | 44 | • https://storyset.com/web 45 | • https://storyset.com/nature 46 | 47 | --- 48 | 49 | After all necessary changes, you can commit and push your changes to your forked repository, and deploy however you like. 50 | 51 | All that I ask is please link my profile somewhere in your ReadMe when you deploy, or wherever. 52 | 53 | Send me your portfolio link here: `gohilyagnik3@gmail.com` 54 | 55 | ![](https://visitor-badge.glitch.me/badge?page_id=Yagnik-Gohil.Portfolio) 56 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "portfolio", 3 | "version": "0.1.0", 4 | "private": true, 5 | "dependencies": { 6 | "@testing-library/jest-dom": "^5.16.5", 7 | "@testing-library/react": "^13.3.0", 8 | "@testing-library/user-event": "^13.5.0", 9 | "react": "^18.2.0", 10 | "react-dom": "^18.2.0", 11 | "react-icons": "^4.4.0", 12 | "react-router-dom": "^6.3.0", 13 | "react-scripts": "5.0.1", 14 | "web-vitals": "^2.1.4" 15 | }, 16 | "scripts": { 17 | "start": "react-scripts start", 18 | "build": "react-scripts build", 19 | "test": "react-scripts test", 20 | "eject": "react-scripts eject" 21 | }, 22 | "eslintConfig": { 23 | "extends": [ 24 | "react-app", 25 | "react-app/jest" 26 | ] 27 | }, 28 | "browserslist": { 29 | "production": [ 30 | ">0.2%", 31 | "not dead", 32 | "not op_mini all" 33 | ], 34 | "development": [ 35 | "last 1 chrome version", 36 | "last 1 firefox version", 37 | "last 1 safari version" 38 | ] 39 | } 40 | } 41 | -------------------------------------------------------------------------------- /public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/favicon.ico -------------------------------------------------------------------------------- /public/images/Development-pana.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/images/Development-pana.png -------------------------------------------------------------------------------- /public/images/Microsoft.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/images/Microsoft.png -------------------------------------------------------------------------------- /public/images/React.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/images/React.png -------------------------------------------------------------------------------- /public/images/bootstrap.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/images/bootstrap.png -------------------------------------------------------------------------------- /public/images/c-sharp.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/images/c-sharp.png -------------------------------------------------------------------------------- /public/images/c.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/images/c.png -------------------------------------------------------------------------------- /public/images/cpp.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/images/cpp.png -------------------------------------------------------------------------------- /public/images/css.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/images/css.png -------------------------------------------------------------------------------- /public/images/html.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/images/html.png -------------------------------------------------------------------------------- /public/images/js.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/images/js.png -------------------------------------------------------------------------------- /public/images/nomad-amico.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/images/nomad-amico.png -------------------------------------------------------------------------------- /public/images/nomad-bro.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/images/nomad-bro.png -------------------------------------------------------------------------------- /public/images/python.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/images/python.png -------------------------------------------------------------------------------- /public/images/sql-server.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/images/sql-server.png -------------------------------------------------------------------------------- /public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 12 | 13 | 17 | 18 | 27 | 28 | Portfolio 29 | 30 | 31 | 32 |
33 | 43 | 44 | 45 | 46 | -------------------------------------------------------------------------------- /public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/logo192.png -------------------------------------------------------------------------------- /public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/logo512.png -------------------------------------------------------------------------------- /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 | -------------------------------------------------------------------------------- /public/portfolio-images/m-01.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/portfolio-images/m-01.png -------------------------------------------------------------------------------- /public/portfolio-images/m-02.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/portfolio-images/m-02.png -------------------------------------------------------------------------------- /public/portfolio-images/m-03.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/portfolio-images/m-03.png -------------------------------------------------------------------------------- /public/portfolio-images/n-01.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/portfolio-images/n-01.png -------------------------------------------------------------------------------- /public/portfolio-images/n-02.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/portfolio-images/n-02.png -------------------------------------------------------------------------------- /public/portfolio-images/n-03.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/portfolio-images/n-03.png -------------------------------------------------------------------------------- /public/portfolio-images/n-04.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/portfolio-images/n-04.png -------------------------------------------------------------------------------- /public/portfolio-images/resume-1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/portfolio-images/resume-1.jpg -------------------------------------------------------------------------------- /public/portfolio-images/resume-2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/portfolio-images/resume-2.jpg -------------------------------------------------------------------------------- /public/portfolio-images/resume-3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/portfolio-images/resume-3.jpg -------------------------------------------------------------------------------- /public/portfolio-images/resume-4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/portfolio-images/resume-4.jpg -------------------------------------------------------------------------------- /public/portfolio-images/solo-01.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/portfolio-images/solo-01.png -------------------------------------------------------------------------------- /public/portfolio-images/solo-02.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/portfolio-images/solo-02.png -------------------------------------------------------------------------------- /public/portfolio-images/solo-03.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/portfolio-images/solo-03.png -------------------------------------------------------------------------------- /public/portfolio-images/solo-04.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/portfolio-images/solo-04.png -------------------------------------------------------------------------------- /public/portfolio-images/tour-01.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/portfolio-images/tour-01.png -------------------------------------------------------------------------------- /public/portfolio-images/tour-02.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/portfolio-images/tour-02.png -------------------------------------------------------------------------------- /public/portfolio-images/tour-03.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/portfolio-images/tour-03.jpg -------------------------------------------------------------------------------- /public/portfolio-images/tour-04.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/portfolio-images/tour-04.jpg -------------------------------------------------------------------------------- /public/portfolio-images/tour-05.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/portfolio-images/tour-05.jpg -------------------------------------------------------------------------------- /public/portfolio-images/w-01.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/portfolio-images/w-01.png -------------------------------------------------------------------------------- /public/portfolio-images/w-02.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/portfolio-images/w-02.png -------------------------------------------------------------------------------- /public/portfolio-images/w-03.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Yagnik-Gohil/Portfolio/f26219af8141db04e231a61f7dc1cf3c19824b2f/public/portfolio-images/w-03.png -------------------------------------------------------------------------------- /public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /src/App.css: -------------------------------------------------------------------------------- 1 | /* 2 | Color Scheme: 3 | Get your favourite theme here: https://colorhunt.co/ and change all occurrences of below colors 4 | 5 | #1A1A2E Black 6 | #16213E Dark Blue 7 | #0F3460 Blue 8 | #E94560 Red 9 | 10 | Fonts: 11 | https://fonts.google.com/ 12 | 13 | go to google fonts and select one regular and one bold font and replpace the import url 14 | change font-family in 15 | html, body 16 | ff-jose 17 | font-big 18 | 19 | */ 20 | 21 | 22 | @import url('https://fonts.googleapis.com/css2?family=Jost&family=Quicksand&display=swap'); 23 | 24 | html, body{ 25 | margin: 0; 26 | font-family: 'Quicksand', sans-serif; 27 | background-color: #16213E; 28 | color: white; 29 | } 30 | 31 | .ff-jose{ 32 | font-family: 'Jost', sans-serif ; 33 | } 34 | .font-big{ 35 | font-family: 'Jost', sans-serif; 36 | font-size: 50px; 37 | font-weight: bolder; 38 | letter-spacing: 2px; 39 | } 40 | .bg-dark{ 41 | background-color: #1A1A2E !important; 42 | } 43 | .bg-blue { 44 | background-color: #0F3460; 45 | } 46 | .text-red { 47 | color: #E94560; 48 | } 49 | .text-black { 50 | color: #1A1A2E; 51 | } 52 | .dropdown-item:active { 53 | background-color: #0F3460 !important; 54 | } 55 | .active { 56 | color: #E94560 !important; 57 | background-color: #1A1A2E !important; 58 | font-weight: 600; 59 | transition: transform 0.2s; 60 | transform: scale(1.1); 61 | } 62 | @keyframes slideInLeft { 63 | 0% { 64 | transform: translateX(-100%); 65 | } 66 | 100% { 67 | transform: translateX(0); 68 | } 69 | } 70 | @keyframes slideInTop { 71 | 0% { 72 | transform: translateY(-10%); 73 | opacity: 0; 74 | } 75 | 100% { 76 | transform: translateY(0); 77 | } 78 | } 79 | @keyframes slideInBottom { 80 | 0% { 81 | transform: translateY(10%); 82 | opacity: 0; 83 | } 84 | 100% { 85 | transform: translateY(0); 86 | } 87 | } 88 | @keyframes slideInBottomTechnology { 89 | 0% { 90 | transform: translateY(10%); 91 | } 92 | 100% { 93 | transform: translateY(0); 94 | } 95 | } 96 | 97 | .slide-in-left { 98 | animation-duration: 1s; 99 | animation-timing-function: ease-in-out; 100 | animation-delay: 0s; 101 | animation-iteration-count: 1; 102 | animation-name: slideInLeft; 103 | } 104 | .slide-in-top { 105 | animation-duration: 1s; 106 | animation-timing-function: ease-in-out; 107 | animation-delay: 0s; 108 | animation-iteration-count: 1; 109 | animation-name: slideInTop; 110 | } 111 | .slide-in-bottom { 112 | animation-duration: 1s; 113 | animation-timing-function: ease-in-out; 114 | animation-delay: 0s; 115 | animation-iteration-count: 1; 116 | animation-name: slideInBottom; 117 | } 118 | 119 | /* ===================== Transition ===================== */ 120 | 121 | .animate-charcter 122 | { 123 | background-image: linear-gradient(-225deg,#ffffff,#E94560,#E94560,#ffffff); 124 | background-size: auto auto; 125 | background-clip: border-box; 126 | background-size: 200% auto; 127 | color: #fff; 128 | background-clip: text; 129 | -webkit-background-clip: text; 130 | -webkit-text-fill-color: transparent; 131 | animation: textclip 2s linear infinite; 132 | } 133 | 134 | @keyframes textclip { 135 | to { 136 | background-position: 200% center; 137 | } 138 | } 139 | 140 | /* ===================== Home ===================== */ 141 | .ls-2{ 142 | letter-spacing: 2px; 143 | } 144 | 145 | /* ===================== Skills ===================== */ 146 | .mw-fc { 147 | max-width: fit-content; 148 | } 149 | 150 | /* ===================== Resume ===================== */ 151 | li::marker { 152 | color: #E94560; 153 | font-size: 2em; 154 | } 155 | .blue-label{ 156 | background-color: #0F3460; 157 | width: max-content; 158 | } 159 | .zoom-on-hover:hover { 160 | transition: transform 0.2s; 161 | transform: scale(1.1); 162 | } 163 | 164 | /* ===================== Portfolio ===================== */ 165 | 166 | .portfolio-link:hover{ 167 | background-color: #E94560; 168 | -webkit-transition: background-color 300ms linear; 169 | -ms-transition: background-color 300ms linear; 170 | transition: background-color 300ms linear; 171 | } -------------------------------------------------------------------------------- /src/App.js: -------------------------------------------------------------------------------- 1 | import './App.css'; 2 | import {Routes,Route} from "react-router-dom"; 3 | import About from './components/About'; 4 | import Home from './components/Home'; 5 | import Sidebar from './components/Sidebar'; 6 | import Skills from './components/Skills'; 7 | import Resume from './components/Resume'; 8 | import MyWork from './components/MyWork'; 9 | 10 | function App() { 11 | return ( 12 |
13 |
14 | 15 | 16 | 17 | } exact> 18 | }> 19 | }> 20 | }> 21 | }> 22 | 23 | 24 |
25 |
26 | ); 27 | } 28 | 29 | export default App; 30 | -------------------------------------------------------------------------------- /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 | -------------------------------------------------------------------------------- /src/components/About.js: -------------------------------------------------------------------------------- 1 | import React, { Fragment } from 'react' 2 | 3 | function About() { 4 | return ( 5 | 6 |
7 | 8 |
9 |
10 | 11 | 12 | 13 | 14 |
15 |
16 |

About me

17 |
18 |

Ambitious full-stack developer, a self-led learner and team player

19 | with one year of experience in web developement. 20 |

21 |

22 | Currently looking for new opportunities in industry and willing

23 | to work on challenging and diverse projects with the latest technologies. 24 |

25 |

26 | Previously worked as Full stack web developer.

27 | The technology I've worked on : Asp.Net Core, Asp.Net Mvc,

28 | C#, Sql, Ssms, Telerik-UI, Html, Css, Js, Bootstrap 29 |

30 |

31 | Currently Learning React Js Library 32 |

33 |
34 |
35 |
36 | ... 37 |
38 | 39 | 40 | 41 |
42 |
43 | 44 | 45 |
46 | 47 | ) 48 | } 49 | 50 | export default About -------------------------------------------------------------------------------- /src/components/Home.js: -------------------------------------------------------------------------------- 1 | import React, { Fragment } from 'react' 2 | 3 | function Home() { 4 | return ( 5 | 6 |
7 | 8 |
9 | 10 |
11 | 12 |
13 |
14 |

Hi,

15 |

I'm Yagnik,

16 |

Full Stack Developer / Computer Engineer / Artist

17 |
18 |
19 | 20 |
21 | ... 22 |
23 | 24 |
25 | 26 |
27 | 28 |
29 | 30 | ) 31 | } 32 | 33 | export default Home -------------------------------------------------------------------------------- /src/components/MyWork.js: -------------------------------------------------------------------------------- 1 | import React, { Fragment } from 'react' 2 | import { GrPrevious, GrNext } from 'react-icons/gr'; 3 | import { BsLaptop } from 'react-icons/bs'; 4 | import { AiFillGithub } from 'react-icons/ai'; 5 | 6 | function MyWork() { 7 | return ( 8 | 9 |
10 |
11 | 12 |
13 |
14 |

Something I've Built

15 |
16 |
17 |
18 |
19 |
20 | 21 |
22 |
23 |
24 | ... 25 |
26 |
27 | ... 28 |
29 |
30 | ... 31 |
32 |
33 | 37 | 41 |
42 |
Weather App
43 |
44 | Watch Live 45 | Source Code 46 |
47 | 48 |
49 |
50 | 51 |
52 |
53 |
54 | ... 55 |
56 |
57 | ... 58 |
59 |
60 | ... 61 |
62 |
63 | 67 | 71 |
72 |
73 |
Movie Browser
74 |
75 | Watch Live 76 | Source Code 77 |
78 |
79 | 80 |
81 |
82 | 83 |
84 |
85 |
86 | ... 87 |
88 |
89 | ... 90 |
91 |
92 | ... 93 |
94 |
95 | ... 96 |
97 |
98 | 102 | 106 |
107 |
Notes MarketPlace
108 |
109 | Source Code 110 |
111 | 112 |
113 |
114 | 115 |
116 |
117 |
118 | ... 119 |
120 |
121 | ... 122 |
123 |
124 | ... 125 |
126 |
127 | ... 128 |
129 |
130 | 134 | 138 |
139 |
Solo
140 |
141 | Watch Live 142 | Source Code 143 |
144 | 145 |
146 |
147 | 148 |
149 |
150 |
151 | ... 152 |
153 |
154 | ... 155 |
156 |
157 | ... 158 |
159 |
160 | ... 161 |
162 |
163 | 167 | 171 |
172 |
Resume Builder
173 |
174 | Watch Live 175 | Source Code 176 |
177 | 178 |
179 |
180 | 181 |
182 |
183 |
184 | ... 185 |
186 |
187 | ... 188 |
189 |
190 | ... 191 |
192 |
193 | ... 194 |
195 |
196 | ... 197 |
198 |
199 | 203 | 207 |
208 |
Natours
209 |
210 | Watch Live 211 | Source Code 212 |
213 | 214 |
215 |
216 | 217 |
218 |
219 | 220 | ) 221 | } 222 | 223 | export default MyWork -------------------------------------------------------------------------------- /src/components/Resume.js: -------------------------------------------------------------------------------- 1 | import React, { Fragment } from 'react' 2 | import { SiCodechef, SiHackerrank } from 'react-icons/si'; 3 | 4 | function Resume() { 5 | return ( 6 | 7 |
8 |
9 | 10 |
11 |
12 |

YAGNIK GOHIL

13 |
14 |
15 |
16 |
17 |
18 |

EXPERIENCE

19 |
    20 |
  • 21 |

    Trainee Software Engineer

    22 |
    Jul 2021 - Apr 2022
    23 |

    TatvaSoft · Full-time

    24 |

    Ahmedabad, Gujarat, India

    25 |
    • 26 |
  • 27 |

    Internship Trainee

    28 |
    Dec 2020 - Apr 2021
    29 |

    TatvaSoft · Internship

    30 |

    Ahmedabad, Gujarat, India

    31 |
    • 32 |
33 |
34 |
35 | 36 |

EDUCATION

37 |
    38 |
  • 39 |

    BE - Computer Engineering

    40 |
    2017 - 2021
    41 |

    Gujarat Technological University

    42 |

    CGPA: 8.05

    43 |
    • 44 |
  • 45 |

    Higher Secondary School

    46 |
    2017
    47 |

    Shree B.M.Commerce High School

    48 |

    Grade: 71.69 %

    49 |
    • 50 |
51 | 52 |
53 |
54 | 55 |
56 | 57 |
58 |
59 |

PROFILE

60 |

61 | 62 | 63 | 64 | 65 | 66 | 67 |

68 |
69 |
70 | 71 |
72 |
73 | 74 | ) 75 | } 76 | 77 | export default Resume -------------------------------------------------------------------------------- /src/components/Sidebar.js: -------------------------------------------------------------------------------- 1 | import React, { Fragment } from 'react' 2 | import {VscHome} from 'react-icons/vsc' 3 | import {FiUser} from 'react-icons/fi' 4 | import {BsCode} from 'react-icons/bs' 5 | import {MdOutlineDashboard, MdOutlineContactPage, MdEmail} from 'react-icons/md' 6 | import {AiFillLinkedin, AiFillSkype, AiFillGithub, AiOutlineUnorderedList} from 'react-icons/ai' 7 | import {VscAccount} from 'react-icons/vsc' 8 | import {Link, NavLink} from "react-router-dom"; 9 | 10 | function Sidebar() { 11 | return ( 12 | 13 | 14 | 15 |
16 |
17 | 18 | Yagnik 19 | 20 | 47 |
48 |
49 | 53 | 64 |
65 |
66 |
67 | 68 | 69 | ) 70 | } 71 | 72 | export default Sidebar -------------------------------------------------------------------------------- /src/components/Skills.js: -------------------------------------------------------------------------------- 1 | import React, { Fragment } from 'react' 2 | import {SiJavascript,SiMicrosoftsqlserver,SiNodedotjs,SiDotnet,SiReact,SiHtml5,SiCss3,SiBootstrap,SiCsharp,SiMongodb,SiExpress,SiPug} from 'react-icons/si' 3 | function Skills() { 4 | return ( 5 | 6 |
7 |
8 |
9 |
10 |
11 |

Technologies I know

12 |
13 | 14 |
15 | 16 |
17 | JavaScript 18 |
19 |
20 | Microsoft SQL Server 21 |
22 |
23 | Node.js 24 |
25 |
26 | ASP.NET Core 27 |
28 |
29 | React 30 |
31 |
32 | Html 33 |
34 |
35 | Css 36 |
37 |
38 | Bootstrap 39 |
40 |
41 | C# 42 |
43 |
44 | MongoDB 45 |
46 |
47 | Express 48 |
49 |
50 | Pug 51 |
52 | 53 |
54 | 55 | 56 |
57 |
58 |
59 | ... 60 |
61 |
62 |
63 | 64 |
65 | 66 | ) 67 | } 68 | 69 | export default Skills -------------------------------------------------------------------------------- /src/index.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 0; 3 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 4 | 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 5 | sans-serif; 6 | -webkit-font-smoothing: antialiased; 7 | -moz-osx-font-smoothing: grayscale; 8 | } 9 | 10 | code { 11 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 12 | monospace; 13 | } 14 | -------------------------------------------------------------------------------- /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 | import { BrowserRouter } from 'react-router-dom'; 7 | 8 | const root = ReactDOM.createRoot(document.getElementById('root')); 9 | root.render( 10 | 11 | 12 | 13 | 14 | 15 | ); 16 | 17 | // If you want to start measuring performance in your app, pass a function 18 | // to log results (for example: reportWebVitals(console.log)) 19 | // or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals 20 | reportWebVitals(); 21 | -------------------------------------------------------------------------------- /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/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 | --------------------------------------------------------------------------------