Skip to content

Commit

Permalink
I have made some few changes
Browse files Browse the repository at this point in the history
  • Loading branch information
Lokprakash-babu committed Feb 1, 2020
1 parent a4ed2a5 commit 8a086ce
Show file tree
Hide file tree
Showing 3 changed files with 217 additions and 30 deletions.
229 changes: 201 additions & 28 deletions about.html
Original file line number Diff line number Diff line change
Expand Up @@ -48,42 +48,215 @@ <h1 class="animated bounce">The Complete Web Developer in 2020</h1>
<h2 class="animated bounce">Course Content</h2>

<ul class="list-group list-group-flush">
<li class="list-group-item">Introduction</li>
<li class="list-group-item">How The Internet Works</li>
<li class="list-group-item">History Of The Web</li>
<li class="list-group-item">HTML 5</li>
<li class="list-group-item">Advanced HTML 5</li>
<li class="list-group-item">CSS</li>
<li class="list-group-item">Advanced CSS</li>
<li class="list-group-item">
<li class="list-group-item dropDown">Introduction
<div class="dropDownContent">
<p>
In this you will be introduced with the course content and to the community.
</p>
</div>
</li>
<li class="list-group-item dropDown">How The Internet Works
<div class="dropDownContent">
<p>
You'll learn how the internet works, inspecting the google, and what is the work of a developer.
</p>
</div>
</li>
<li class="list-group-item dropDown">History Of The Web
<div class="dropDownContent">
<p>
You'll start from the history and get introduced with HTML, CSS and Javascript.
</p>
</div>
</li>
<li class="list-group-item dropDown">HTML 5
<div class="dropDownContent">
<p>
You'll be learning the basic concepts of HTML such as tags, self closing tags, anchor tags.
</p>
</div>

</li>
<li class="list-group-item dropDown">Advanced HTML 5
<div class="dropDownContent">
<p>
You'll be learning with advanced concepts such as submitting forms.
</p>
</div>

</li>
<li class="list-group-item dropDown">CSS
<div class="dropDownContent">
<p>
You'll get to know about the CSS and some of the basics in CSS.
</p>
</div>
</li>
<li class="list-group-item dropDown">Advanced CSS
<div class="dropDownContent">
<p>
You'll get to know some advanced concepts such as animations.
</p>
</div>
</li>
<li class="list-group-item dropDown">
Bootstrap 4, Templates, And Building Your Startup Landing Page
<div class="dropDownContent">
<p>
You'll learn to use bootstrap in your projects to make it look awesome.
</p>
</div>

</li>
<li class="list-group-item dropDown">CSS Grid + CSS Layout
<div class="dropDownContent">
<p>
You'll learn one of the latest features of CSS known as CSS grid.
</p>
</div>

</li>
<li class="list-group-item dropDown">Career Of A Web Developer
<div class="dropDownContent">
<p>
You'll know about the recent techs and how to cover your lack of experience.
</p>
</div>
</li>
<li class="list-group-item dropDown">Javascript
<div class="dropDownContent">
<p>
You'll get to know the power of Java script and implement your new power in a project.
</p>
</div>

</li>
<li class="list-group-item dropDown">DOM Manipulation
<div class="dropDownContent">
<p>
You will learn what is meant by DOM and how to manipulate it in order to create some cool website.
</p>
</div>
</li>
<li class="list-group-item dropDown">Advanced Javascript
<div class="dropDownContent">
<p>
You'll learn some advanced concepts in javascripts such as currying, composing Etc.
</p>
</div>
</li>
<li class="list-group-item">CSS Grid + CSS Layout</li>
<li class="list-group-item">Career Of A Web Developer</li>
<li class="list-group-item">Javascript</li>
<li class="list-group-item">DOM Manipulation</li>
<li class="list-group-item">Advanced Javascript</li>
<li class="list-group-item">Command Line</li>
<li class="list-group-item">Developer Environment</li>
<li class="list-group-item">Git + Github + Open Source Projects</li>
<li class="list-group-item">A Day In The Life Of A Developer</li>
<li class="list-group-item">NPM + NPM Scripts</li>
<li class="list-group-item">React.js + Redux</li>
<li class="list-group-item">
<li class="list-group-item dropDown">Command Line
<div class="dropDownContent">
<p>
You'll learn to use terminal/command prompt for the web development.
</p>
</div>
</li>
<li class="list-group-item dropDown">Developer Environment
<div class="dropDownContent">
<p>
You'll configure your editor to make it look like a pro.
</p>
</div>
</li>
<li class="list-group-item dropDown">Git + Github + Open Source Projects
<div class="dropDownContent">
<p>
You'll learn to contribute to an open source project by learning Git.
</p>
</div>
</li>
<li class="list-group-item dropDown">A Day In The Life Of A Developer
<div class="dropDownContent">
<p>
A typical day of a developer.
</p>
</div>
</li>
<li class="list-group-item dropDown">NPM + NPM Scripts
<div class="dropDownContent">
<p>
You'll get to know about NPM and how to setup NPM.
</p>
</div>
</li>
<li class="list-group-item dropDown">React.js + Redux
<div class="dropDownContent">
<p>
You'll learn one of the upcoming technology known as React and Redux.
</p>
</div>
</li>
<li class="list-group-item dropDown">
HTTP/JSON/AJAX + Asynchronous Javascript
<div class="dropDownContent">
<p>
You'll get hands on in one of the important feature of ES8.
</p>
</div>

</li>
<li class="list-group-item">Backend Introduction</li>
<li class="list-group-item">APIs</li>
<li class="list-group-item">FINAL PROJECT: SmartBrain Front-End</li>
<li class="list-group-item">Node.js + Express.js</li>
<li class="list-group-item">
<li class="list-group-item dropDown">Backend Introduction
<div class="dropDownContent">
<p>
You'll be introduced with the backend.
</p>
</div>
</li>
<li class="list-group-item dropDown">APIs
<div class="dropDownContent">
<p>
You'll be introduced with APIs and an optional exercise to explore more in it.
</p>
</div>
</li>
<li class="list-group-item dropDown">FINAL PROJECT: SmartBrain Front-End
<div class="dropDownContent">
<p>
This is an ultimate part where you'll build the front end for your final project.
</p>
</div>
</li>
<li class="list-group-item dropDown">Node.js + Express.js
<div class="dropDownContent">
<p>
You'll get to know about Node and Express.
</p>
</div>
</li>
<li class="list-group-item dropDown">
FINAL PROJECT: SmartBrain Back-End -- Server
<div class="dropDownContent">
<p>
You'll build the backend for your final project.
</p>
</div>

</li>
<li class="list-group-item dropDown">Databases
<div class="dropDownContent">
<p>
You'll learn about the databases.
</p>
</div>

</li>
<li class="list-group-item">Databases</li>
<li class="list-group-item">
<li class="list-group-item dropDown">
FINAL PROJECT: SmartBrain Back-End -- Database
<div class="dropDownContent">
<p>
You'll confiure your final project with the database you have learned in this course.
</p>
</div>

</li>
<li class="list-group-item dropDown">Production + Deployment
<div class="dropDownContent">
<p>
Finally, deployment.
</p>
</div>
</li>
<li class="list-group-item">Production + Deployment</li>
<li class="list-group-item">Where To Go From Here?</li>
<li class="list-group-item">Bonus:Extra Bits</li>
<li class="list-group-item">Extra: For Windows Users</li>
Expand Down
2 changes: 1 addition & 1 deletion index.html
Original file line number Diff line number Diff line change
Expand Up @@ -62,7 +62,7 @@ <h1>Web Development <br>
<div class="course-details-content">
<h2 class="animated bounce">Why this Course?</h2>
<p class="paragraph-block">
<p>Do you dream about working as a web developer?</p>
<p>Do you imagine yourself working as a web developer but don't know where to start</p>
<p>You want to learn the basics that can get you up and running quickly?</p>
<p>Do you want to make money in 2020?</p>
<br>
Expand Down
16 changes: 15 additions & 1 deletion resources/style/style.css
Original file line number Diff line number Diff line change
Expand Up @@ -255,6 +255,20 @@ i:hover {
.card-body {
transition: all 0.2s ease-in;
}
.dropDown{
position: relative;
display: inline-block;
}
.dropDownContent{
display: none;
position: absolute;
background-color: #f1f1f1;
min-width: 160px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
z-index: 1;
}

.dropDown:hover .dropDownContent {display: block;}

.card:hover {
background-color: #e6e6e6;
Expand All @@ -270,4 +284,4 @@ i:hover {
margin-left: .5rem;
padding: 0px;
}
}
}

0 comments on commit 8a086ce

Please sign in to comment.