Skip to content

Commit

Permalink
first commit
Browse files Browse the repository at this point in the history
  • Loading branch information
@AryanSingh11
AryanSingh11 committed Dec 12, 2021
0 parents commit 23a0566
Show file tree
Hide file tree
Showing 11 changed files with 338 additions and 0 deletions.
Binary file added coder.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added elon.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added frontend.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added iconreact.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added iconreact2.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Empty file added img
Empty file.
322 changes: 322 additions & 0 deletions index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,322 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.css">

<link rel = "stylesheet" href = "./style.css">

<title> Frontend Bootcamp </title>

</head>
<body>

<!-- navbar -->
<nav class = "navbar navbar-expand-lg bg-dark navbar-dark py-2 fixed-top" >
<div class="container">
<a href="#" class="navbar-brand"> Frontend Bootcamp </a>

<button
class="navbar-toggler"
type="button"
data-bs-toggle="collapse"
data-bs-target="#threelines"
>
<span class="navbar-toggler-icon"></span>

</button>

<div class="collapse navbar-collapse" id="threelines">
<ul class="navbar-nav ms-auto" >

<li class="nav-item">
<a href="#learn" class="nav-link"> What you'll learn </a>
</li>
<li class="nav-item">
<a href="#Questions" class="nav-link"> Questions </a>
</li>
<li class="nav-item">
<a href="#Instructors" class="nav-link"> Instructors </a>
</li>

</ul>
</div>

</div>

</nav>

<!-- showcase -->
<section class="bg-dark text-light p-5 p-lg-0 pt-lg-5 text-center text-sm-start">
<div class="container">
<div class="d-sm-flex align-items-center justify-content-between ">
<div>
<h3> Become a <span class="text-warning"> Web Developer</span> </h3>
<p class=" lead mx=4 my-4 "> Here we provide you with a structured course that will teach you all you need to know to become a front-end web developer. Work through each section, learning new skills (or improving existing ones) as you go along. Each section includes exercises and assessments to test your understanding before you move forward.
</p>
<button class="btn btn-primary btn-large my-md-5"> Start Enrollment Now </button>

</div>
<img class="img-fluid w-50 d-none d-sm-block px-2" src="coder.png" alt="">
</div>

</div>

</section>


<!-- Newsletter -->

<section class="bg-primary text-light p-4">
<div class="container">

<div class="d-md-flex justify-content-between align-items-center">
<h3 class="mb-3 mb-md-0">Signup for our Newsletter</h3>

<div class="input-group signup" >
<input type="text" class="form-control" placeholder="Ex. [email protected] ">
<button class="btn btn-outline-secondary btn-dark btn-lg" type="button" id="button-addon2"> Subscribe </button>
</div>

</div>
</div>


</section>

<!-- boxes -->

<section class="p-5">
<div class="container">
<div class="row text-center g-3">

<div class="col-md">
<div class="card" style="width: 18rem mb-3" >
<img src="https://icons.getbootstrap.com/icons/laptop/" class="card-img-top" alt="">
<div class="card-body bg-dark text-light">
<h3 class="card-title">Virtual Classes</h3>
<p class="card-text p-3"> High qualiity thorough explanations where we dive deep into concepts.</p>
<a href="#" class="btn btn-primary">Read more...</a>
</div>
</div>
</div>


<div class="col-md">
<div class="card" style="width: 18rem mb-3">
<img src="https://icons.getbootstrap.com/icons/laptop/" class="card-img-top" alt="">
<div class="card-body bg-light text-dark">
<h3 class="card-title">Live Events</h3>
<p class="card-text p-3"> We organize offline events where you meet live with instructors and network with fellow students once every month.</p>
<a href="#" class="btn btn-secondary">Read more...</a>
</div>
</div>
</div>


<div class="col-md">
<div class="card" style="width: 18rem mb-3">
<img src="https://icons.getbootstrap.com/icons/laptop/" class="card-img-top" alt="">
<div class="card-body bg-dark text-light">
<h3 class="card-title">Doubt solving </h3>
<p class="card-text p-3"> We provide attention to each student and take time to clarify their concepts.</p>
<a href="#" class="btn btn-primary">Read more...</a>
</div>
</div>
</div>

</div>
</div>
</section>

<!-- learn sections -->
<!-- section 1 -->
<section id="learn" class="p-5">
<div class="container">
<div class="row align-items-center justify-content-between">
<div class="col-md">
<img src="frontend.png" alt="" class="img-fluid">
</div>
<div class="col-md p-5">
<h2 class> Learn Fundamentals </h2>
<p class="lead"> The major building blocks of the web are HTML, CSS, and JavaScript. We will be talking about all three languages. We can also think of web development as being split into two main categories: front end and back end. We will discuss about Front end in detail.</p>
<p>Everything you have ever seen on the web is considered ‘front end’. Front end is what we see when we open a web page or app. Code is downloaded from a server and is rendered to the screen by a web browser. What happens when we interact with the code is also considered front end.</p>
<a href="" class="btn btn-secondary btn-large">
<i class="bi bi-chevron-right">
</i> Read more here </a>
</div>
</div>
</div>
</section>

<!-- section 2 -->

<section id="" class="p-5 bg-dark text-light">
<div class="container">
<div class="row align-items-center justify-content-between">

<div class="col-md p-5">
<h2 class> Learn React </h2>
<p class="lead"> ReactJS offers graceful solutions to some of front-end programming’s most persistent issues, allowing you to build dynamic and interactive web apps with ease. It’s fast, scalable, flexible, powerful, and has a robust developer community that’s rapidly growing. There’s never been a better time to learn React.</p>
<p>You’ll develop a strong understanding of React’s most essential concepts: JSX, class and function components, props, state, lifecycle methods, and hooks. You’ll be able to combine these ideas in React’s modular programming style.</p>
<a href="" class="btn btn-light btn-large">
<i class="bi bi-chevron-right">
</i> Read more here </a>
</div>

<div class="col-md">
<img src="iconreact2.png" alt="" class="img-fluid">
</div>

</div>
</div>
</section>



<!-- questions accordion -->


<section id="Questions" class="p-5">
<div class="container">
<h2 class="text-center mb-3">Frequently asked questions
</h2>

<div class="accordion accordion-flush my-3" id="questions">

<!-- faq-1 -->
<div class="accordion-item">
<h2 class="accordion-header" id="flush-headingOne">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#flush-collapseOne">
I Don't Have Coding Experience, Can I Take This Course?
</button>
</h2>
<div id="flush-collapseOne" class="accordion-collapse collapse" aria-labelledby="flush-headingOne" data-bs-parent="#questions">
<div class="accordion-body">
Yes! 70-80% of our students don't have coding experience when they enrol in the program. Lots of boot camps say they don't require coding experience, but then have all these hurdles to getting started. We don't have a coding challenge or technical assessment to enrol, because we know that we can teach you, no matter where you start. Our Programming Basics course was designed just for students that have little to no experience. This course was developed expressly to make sure that students are successful, no matter where they start.
</div>
</div>
</div>

<!-- faq-2 -->
<div class="accordion-item">
<h2 class="accordion-header" id="flush-headingTwo">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#flush-collapseTwo">
I Can’t Pay During The Program; What Are My Options To Defer Payment?
</button>
</h2>
<div id="flush-collapseTwo" class="accordion-collapse collapse" aria-labelledby="flush-headingTwo" data-bs-parent="#accordionFlushExample">
<div class="accordion-body">
We get it as a student you may feel a little burden to pay the heavy tuition fees. But we are making it simple for you. We will be charging you only 30% tuition fees upfront. Once you get placed you can pay the remaining via EMI. Talk to us to know more about EMI options.
</div>
</div>
</div>

<!-- faq-3 -->
<div class="accordion-item">
<h2 class="accordion-header" id="flush-headingThree">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#flush-collapseThree">
Is It Possible To Learn So Many Languages So Fast?
</button>
</h2>
<div id="flush-collapseThree" class="accordion-collapse collapse" aria-labelledby="flush-headingThree" data-bs-parent="#accordionFlushExample">
<div class="accordion-body">
We've been around since 2008. Our curriculum is designed by MIT Alumnus after deep research and various employers' feedback we designed this course. We have found that the 4 full-stack model really helps our students stand out from the pack. As long as you put in the work, our instructors and student success team will be there to help.
</div>
</div>
</div>
</div>
</div>
</section>



<!-- instructors section -->

<section id="Instructors" class="p-5 bg-primary">
<div class="container">
<h1 class="text-center text-white p-2 mb-4">
Meet our Experienced Instructors
</h1>
<p class="lead p-2 mb-3 text-center text-white">
All our Instructors have 10+ years of experience in software development
</p>
<div class="row g-3">



<div class="card mb-3 mx-2 col-lg-3 col-md-6 " >
<img src="elon.png" class="card-img-top" alt="The Dogefather"/>
<div class="card-body">
<p class="card-text"> <h4>Elon Musk</h4>He's the favourite around here. Could be found lurking on twitter about Crypto. </p>
<i class="bi bi-twitter text-dark"> The Dogefather</i>
</div>
</div>


<div class="card mb-3 col-lg-3 col-md-6 mx-2" >
<img src="shekk.png" class="card-img-top" alt=""/>
<div class="card-body">
<p class="card-text"> <h4>Shrek</h4>
Likes to live in forest. Has a pet Donkey and a family. Not particularly tolerant of humans</p>
</div>
</div>

<div class="card mb-3 col-lg-3 col-md-6 mx-2" >
<img src="jeffrey.png" class="card-img-top" alt=""/>
<div class="card-body">
<p class="card-text"> <h4> Jeffrey</h4>
Let's just say he's Rich.

Like very VERY Rich </p>
</div>
</div>

<div class="card mb-3 col-lg-3 col-md-6 mx-2" >
<img src="zucc.png" class="card-img-top" alt=""/>
<div class="card-body">
<p class="card-text"> <h4>Zucc</h4>
Rumored to be a Robot. He will teach you React. His company built React afterall</p>
</div>
</div>

</div>

</div>
</section>








<!-- Footer -->

<section class="text-center bg-light p-5 ">
<div class="container">

<div class="div mb-3">
<i class=" bi-github" role="img" ></i>
<a class="btn btn-large btn-dark" href="https://github.com/AryanSingh11" role="button"> Click here to visit my Github Profile</a>
</div>

<div class="div mb-3">
<i class="bi-linkedin bg-primary" role="img" ></i>
<a class="btn btn-large btn-primary" href="https://www.linkedin.com/in/aryan-singh-5221b7203/" role="button"> Click here to visit my LinkedIn Profile</a>
</div>


</div>
</section>

<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous">

</script>
</body>
</html>
Binary file added jeffrey.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added shekk.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
16 changes: 16 additions & 0 deletions style.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
body::before
{ display: block;
content: '';
height: 50px;


}


@media(min-width:768px){
.signup{
width:50%

}

}
Binary file added zucc.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.

0 comments on commit 23a0566

Please sign in to comment.