-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathindex.html
301 lines (256 loc) · 15.1 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="robots" content="noodp">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Portfolio Website of Shivansh Srivastava - Computer Science Undergrad at IIIT Gwalior"/>
<meta itemprop="name" content="Shivansh Srivastava">
<meta itemprop="description" content="Portfolio Website of Shivansh Srivastava - Computer Science Undergrad at IIIT Gwalior"/>
<meta property="og:type" content="website"/>
<meta property="og:url" content="https://sastava007.github.io"/>
<meta property="og:title" content="Shivansh Srivastava | Portfolio Website"/>
<meta property="og:description" content="Portfolio Website of Shivansh Srivastava - Computer Science Undergrad at IIIT Gwalior"/>
<link rel="canonical" href="https://sastava007.github.io">
<meta name="author" content="Shivansh Srivastava"/>
<link rel="icon" type="image/png" sizes="32x32" href="images/favicon-32x32.png">
<!-- External CSS Links-->
<link href="https://fonts.googleapis.com/css?family=Roboto|Comfortaa|Viga|Ubuntu" rel="stylesheet">
<link rel="stylesheet" href="style/animate.css">
<link rel="stylesheet" type="text/css" href="style/index.css">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.2/css/all.css" integrity="sha384-oS3vJWv+0UjzBfQzYUhtDYW+Pj2yciDJxpsK1OYPAYjqT085Qq/1cq5FLXAZQ7Ay" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdn.rawgit.com/konpa/devicon/df6431e323547add1b4cf45992913f15286456d3/devicon.min.css">
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-142767944-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-142767944-1');
</script>
<style>
@font-face{
font-family:Futura;src:
url(style/fonts/Futura-bold.woff2) format('woff2'),
url(style/fonts/Futura-bold.woff) format('woff');font-weight:400;font-style:normal,
url(style/fonts/Futura-bold.ttf) format("truetype")
}
a:hover, a:focus, a:active, a:visited {
text-decoration:none;
text-decoration-color: none;
text-decoration-line: none;
color: black;}
</style>
<title>Shivansh Srivastava</title>
</head>
<body oncopy="return false" onpaste="return false" oncut="return false">
<!--
Thanks to your curiosity which lands you here!
If you love this portfolio website and want more from me then feel free to write to @sastava007
All contents of site are reserved & author hold a copyright on them.
Made with ❤, ☕ & 👨💻
Shivansh Srivastava
-->
<div class="landing" id="particles-js">
<h1>{ Hello World }</h1>
</div>
<span class="typed-text">
<span class="type"></span>
</span>
<img src="images/right-top.svg" id="right1" class="col-sm-6">
<div class="main-container col-sm-12">
<div class="row">
<div class="description col-md-6 col-sm-4 col-xs-12">
<div class="landing-text">
<h1><strong>Hello, I am <span style="color: #ea4141">Shivansh</span></strong></h1>
<h2>CS Undergrad | Open Source Software Developer</h2>
<p>I am a software engineer persuing Computer Science and Engineering at the <span style="color: #ea4141"><strong>Indian Institute of Information Technology(IIIT), Gwalior</strong></span>. I love solving exciting engineering problems which can produce impact at a scale.</p>
<p>I truly believe in open source as a culture, and have contributed to various organizations in the past such as Codeuino, Wikimedia Foundation, and Postman. I have also worked as a mentor for <a href="https://codein.withgoogle.com/" target="_blank"><span style="color: #ea4141; font-weight: bold">Google Code-In</span></a> where I helped <strong>100+</strong> pre-university students to start their career into open-source software development. In past I've also worked as a Full Stack Developer intern at <a href="https://www.diatoz.com/" target="_blank"><span style="color: #ea4141; font-weight: bold;">DIATOZ Solutions</span></a> in Bangalore, and also as a freelance web developer for an ed-tech based startup.</p>
<p>I'm currently exploring full stack software development with keen interest in CI/CD and building scalable web applications.<br> <!-- I'm currently looking for <strong>SWE Internships</strong> for the Summers'21 and if you think I can be a good fit for you team then please consider referring me.</p> -->
<br>
<p>
<div class="main-container-buttons">
<a class="btn-expand" href="./blog.html" target="_blank" rel="nofollow"><span> Blog </span></a>
<a class="btn-expand" href="./cp.html" target="_blank" rel="nofollow" style="margin-left:1vw;"><span>Competitive Programming</span></a>
<a class="btn-expand" href="#sec2" rel="nofollow" style="margin-left:1vw;"><span> Skills </span></a>
</div>
</p><br>
<p>
<div class="main-container-buttons">
<a class="btn-expand" href="#sec3"><span>Projects</span></a>
<a class="btn-expand" href="#sec1" style="margin-left:1vw;"><span> About </span></a>
<a class="btn-expand" href="#sec6" style="margin-left:1vw;"><span> Let's Connect </span></a>
</div>
</p>
</div>
</div>
<div class="profile col-md-6 col-sm-6 col-xs-12">
<img src="./images/developer.svg" class="profile-pic">
</div>
</div>
<img src="images/la-skyline.svg" class="svg-bg col-sm-12">
</div>
<div class="landing-projects-container">
<section id="sec3">
<h1>Featured Projects</h1>
<div class="featured-projects-contain">
<div class="featured-project wow slideInLeft">
<img src="images/video-chat.gif" alt="Technology Innovation & Innovation Center (TIIC)" class="projImg">
<div class="projDesc">
<h3>Multiroom Video Chat WebApp with Horizontal Scaling</h3>
<p>
<ul>
<li>Used Socket.io and WebRTC to run a real-time communication engine and mounted everything over Redis as a database.</li>
<li>Features of app include option to select room and jump b/w rooms at any time of conversation.</li>
<li>Realtime user status i.e (online/ unavailable/ typing)</li>
<li>User can start a video conference within the same private chat.</li>
<li>Implemented a loadbalancer to run concurrently two app servers in order to scale the web app.</l1>
</ul>
</p>
<a href="https://github.com/sastava007/video-chat" target="_blank"><i class="fas fa-link"></i></a>
</div>
</div>
<div class="featured-project wow slideInRight">
<img src="images/foodz.jpeg" alt="Foodz: An Online Food Ordering Website" class="projImg">
<div class="projDesc">
<h3>Foodz</h3>
<p>
<ul>
<li>An online food ordering platform developed using LAMP stack with two end architecture supporting customers & restaurants at
the same time.</li>
<li>It was supported by a SQL database normalized upto 3NF to reduce the redundancy and optimize the query search time.</li>
<li>Allowing users to browse through the menu, add/delete items to
cart, generate bill & restaurants can also add new products or
customize the already existing products.</li>
</ul>
</p>
<a href="https://github.com/sastava007/Foodz" target="_blank"><i class="fas fa-link"></i></a>
</div>
</div>
<div class="featured-project wow slideInUp">
<img class="projImg" src="images/disqss-home.jpeg">
<div class="projDesc">
<h3>Disqs</h3>
<p>
<ul>
<li>Developed a P2P discussion forum website using LAMP stack.</li>
<li>It facilitates users to add question under different categories & subcategories, reply to a thread, upvote other’s comment and delete answer.</li>
<li>It also has an admin panel where administrator of the site can verify pending request of new users, and a central leaderboard showing the most upvoted writers of the platform.</li>
</ul>
</p>
<a href="https://github.com/sastava007/Discussion-Forum" target="_blank"><i class="fas fa-link"></i></a>
</div>
</div>
</div>
</section>
</div>
<div class="skills col-sm-12">
<section id="sec2">
<center><h1>Skills</h1></center>
<span class="skills-icon">
<center>
<div class="wow bounceInUp" data-wow-duration="2s">
<i class="devicon-cplusplus-plain"></i>
<i class="devicon-c-plain"></i>
<i class="devicon-javascript-plain"></i>
<i class="devicon-vuejs-plain-wordmark"></i>
<i class="devicon-nodejs-plain-wordmark" style="font-size: 7vw;"></i>
<i class="devicon-html5-plain"></i>
</span>
</div>
</center>
<div class="wow bounceInUp" data-wow-duration="2s" data-wow-delay="1s" style="margin-top: 2vw;">
<span class="skills-icon">
<center>
<i class="devicon-css3-plain"></i>
<i class="devicon-bootstrap-plain"></i>
<i class="devicon-php-plain" style="font-size: 5vw;"></i>
<i class="devicon-heroku-original"></i>
<i class="devicon-linux-plain"></i>
</center>
</span>
</div>
<div class="wow bounceInUp" data-wow-duration="2s" data-wow-delay="1s" style="margin-top: 3vw;">
<span class="skills-icon">
<center>
<i class="devicon-mongodb-plain-wordmark"></i>
<i class="devicon-redis-plain-wordmark"></i>
<i class="devicon-mysql-plain-wordmark" style="font-size: 6vw;"></i>
<i class="devicon-docker-plain-wordmark"></i>
</center>
</span>
</div>
<div class="wow bounceInUp" data-wow-duration="2s" data-wow-delay="1s" style="margin-top: 3vw;">
<span class="skills-icon">
<center>
<i class="devicon-git-plain"></i>
<i class="devicon-github-plain"></i>
</center>
</span>
</div>
</section>
</div>
<div class="about-container col-sm-12">
<section id="sec1" >
<img src="images/left-bottom.svg" id="left1" class="col-sm-6">
<center><h1 class="about-top">About</h1></center>
<p class="about-content1 wow slideInUp" id="text1">
I am an undergraduate student at <a id="link1" href="http://www.iiitm.ac.in" target="blank">Indian Institute Of Infomation Technology & Management, Gwalior</a>. I'm a software developer and an active open source contributor. The people around me consider me a team player with a can-do attitude, phenominal time management skills, and someone with strong userfocus. I have developed several web based projects, details of which are listed above. I love to explore latest technologies, design cool things and spend my time working on interesting projects.</p>
<p class="about-content1 wow slideInUp" id="text2">
I'm a highly ambitious student who aims to achieve professionalism in various technologies & add value through hard work. I am passionate about creating web applications and designing experiences. I'm an aspiring learner, and I spend a large amount of my free time exploring the latest technolgy adavancements in the web development world. I strive for excellence in each task I do while learning
as much as possible during the process. What motivates me is the belief that Computer Science has great power to make positive impacts in people’s lives. I'm not a party animal so I like to spend my weekends indoor, solving coding problems or watching YT videos.
</p>
<p class="about-content1 wow slideInUp" id="text3">
When I'm not working on college courses or projects, I like to explore Quora, compose oneliners, click photographs and design. I also love exploring new places and talking to different people, discussing ideas and listening to music.</a>
</p>
<section class="social" id="sec6">
<center><h3> Let's Connect</h3></center>
<center>
<span>
<a href="https://www.linkedin.com/in/sastava007/" target="blank"><i class="fab fa-linkedin-in"></i></a>
<a href="https://www.quora.com/profile/Shivansh-Srivastava-53" target="blank"><i class="fab fa-quora"></i></a>
<a href="https://www.facebook.com/sastava007" target="blank"><i class="devicon-facebook-plain"></i></a>
<a href="http://instagram.com/sastava007" target="blank"><i class="fab fa-instagram"></i></a>
<a href="https://github.com/sastava007" target="blank"><i class="fab fa-github"></i></a>
<a href="mailto:[email protected]?subject=Interested in Your Profile"><i class="far fa-envelope"></i></a>
</span>
</center>
</section>
<img src="images/right-bottom.svg" id="right2" class="col-sm-6">
</section>
</div>
<!--External JavaScript Links-->
<script src="https://cdn.jsdelivr.net/npm/[email protected]"></script>
<script>
var typed = new Typed(".type", {
strings: ["I'm Shivansh Srivastava", "A CS Undergrad at IIIT Gwalior","I'm a Software Developer","I love building amazing products","Let's Build Together!","Let's Hack Together!"],
typeSpeed:30,
backSpeed:20,
loop:true,
showCursor:true,
cursorChar: '|',
});
</script>
<script src="https://code.jquery.com/jquery-3.3.1.js"></script>
<script>
$('.toggle').on('click', function() {
$('.menu').toggleClass('active');
});
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/particles.js/2.0.0/particles.min.js"></script>
<script>
particlesJS.load('particles-js', 'assets/particles.json', function()
{
console.log('callback - particles.js Particles Loaded!');
});
</script>
<script src="assets/wow.min.js"></script>
<script>
new WOW().init();
</script>
</body>
</html>