gr33nm0nk2802/ctf-introduction.markdown

## ctf-introduction.markdown

      
    Raw
  

              ctf-introduction.markdown
            
          
    CTF Introduction

A Pen by Syed Modassir Ali on CodePen.
License.

  
## index.html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>CTF</title>
    <link rel="stylesheet" href="style.css">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
</head>
<body>
    <main id="main">
        <div id="title">
            <h1>Capture The Flags</h1>
        </div>

        <div id="img-div">
            <div id="image">
                <img src="https://www.hackerone.com/sites/default/files/Icons_CTF_1.png" class="logo" alt="CTF flag">
            </div>
            <div id="img-caption">CTF is fun!</div>
        </div>

        <br>

        <div id="tribute-info">
            In computer security, Capture the Flag (CTF), a type of <a href="https://en.wikipedia.org/wiki/Wargame_(hacking)" target="_blank" >wargame</a>, is a computer security competition. CTF contests are usually designed to serve as an educational exercise to give participants experience in securing a machine, as well as conducting and reacting to the sort of attacks found in the real world (i.e., bug bounty programs in professional settings). Reverse-engineering, network sniffing, protocol analysis, system administration, programming, and cryptanalysis are all skills which have been required by prior CTF contests at <a href="https://en.wikipedia.org/wiki/DEF_CON" target="_blank">DEF CON</a>.
            <br>
            <br>
            There are three main styles of capture the flag competitions:
            <ul>
                <li>
                    Attack/Defense : In an attack/defense style competition, each team is given a machine (or a small network) to defend on an isolated network. Teams are scored on both their success in defending their assigned machine(s) and on their success in attacking the other team's machines. Depending on the nature of the particular CTF game, teams may either be attempting to take an opponent's flag from their machine or teams may be attempting to plant their own flag on their opponent's machine. Two of the more prominent attack/defense CTF's are held every year at <a href="https://en.wikipedia.org/wiki/DEF_CON" target="_blank">DEF CON</a>, the largest hacker conference, and the NYU-CSAW (Cyber Security Awareness Week), the largest student cyber-security contest.
                </li>
                <br>
                <li>
                    Hardware challenges : Hardware challenges usually involve getting an unknown piece of hardware and having to figure out how to bypass part of the security, e.g. using debugging ports or using a Side-channel attack. and
                </li>
                <br>
                <li>
                    Jeopardy : Jeopardy style competitions usually involve multiple categories of problems, each of which contains a variety of questions of different point values and difficulties. Teams attempt to earn the most points in the competition's time frame (for example 24 hours), but do not directly attack each other. Rather than a race, this style of game play encourages taking time to approach challenges and prioritizes quantity of correct submissions over the timing.
                </li>
                <br>
                <li>
                    KotH : There is a fourth type of CTF, most commonly referred to as King of the Hill (KotH). King of the Hill is similar to Attack/Defend, but instead of everyone having their own machine (or small network) to defend, there are only preconfigured ones, which require all teams to exploit them. Once a team has successfully taken over the machine, the focus shifts to defending the machine from other teams' attacks. Score is usually determined by a score reporting service on the machine, that reports a team token. When one team is able to gain access, they will remove the other team's token and insert their own, thus making them the King of the Hill.
                </li>
            </ul>
            <a href="https://ctftime.org/" id="tribute-link" target="_blank">Click here</a> to get started with CTFs and get tracking of worldwide CTFs.
            <br>
            <br>
            A few helpful resources to learn and practice CTF are:
            <a href="https://overthewire.org/" target="_blank" >OverTheWire</a>,
            <a href="https://www.hacker101.com/" target="_blank" >Hacker101</a>,
            <a href="https://picoctf.com/" target="_blank" >PicoCTF</a>,
            <a href="https://www.hackthissite.org" target="_blank" >HackThisSite</a>,
            <a href="https://www.hackthebox.eu/" target="_blank" >HackTheBox</a>,
            <a href="https://www.vulnhub.com/" target="_blank" >Vulnhub </a>
            <br>
            <br>
            Although, the only way to master CTF is via practice, there are not shortcuts but a few prerequisites to get used to CTF challenges.
            <ul>
                <li>
                    Firstly you need to have "try harder" approach and offensive approach.
                </li>
                <br>
                <li>
                    Secondly, a strong knowledge of networking is required,
                    How the OSI and TCP/IP models work?
                    Client-Server interactions, Http headers, various web technologies like HTML/CSS, JS and PHP.
                </li>
                <br>
                <li>
                    Some familiarity with the linux filesystem will be helpfull.
                </li>
                <br>
                <li>
                    Though not mandatory, having knowledge  of any scripting language like Bash/Python apart from any regular programming is a bonus.
                </li>
                <br>
                <li>
                    Also, try going through writeups on a daily basis. Remember at the end its all about understanding how things work and not being a "SCRIPT KIDDIE".
                </li>
            </ul>
        </div>
        <footer>
            <i class="fa fa-thumbs-up"></i> Wish you all the best for the journey ahead. <i class="fa fa-thumbs-up"></i>
        </footer>
    </main>
    <script src="https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js"></script>
</body>
</html>

## style.css
@import url('https://fonts.googleapis.com/css?family=Bangers&display=swap');

*{
  box-sizing: border-box;
}
:root{
  font-size: 16px;
  margin: 0;
  padding:0;
}

html {
    font-size: 10px;
}

body{
    margin-top: 40px;
    padding: 0 10px 0 15px;
    text-align: center;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    font-weight: 550 ;
    background-color:#30294eea;
    color: #fff;
    font-size: 1rem;
    text-align: justify;
    text-shadow: 1px 1px 1px black
}

@media(max-width: 460px) {
  body {
    font-size: 0.75rem;
  }
}

a{
    text-decoration: none;
    color: rgb(147, 250, 62);
}
a:visited {
    color: #fbfcf9;
}
a:hover{
    color:rgba(68, 66, 66, 0.5);
}


ul{
    list-style: inside;
    text-align: left;
}

h1{
    text-align: center;
    font-size: 4rem;
    text-shadow: 1px 1px 2px black,0 0 5px blue,4px 4px 7px rgb(81, 98, 192);
    background-color:#504b69ea;
    position: relative;
    width: 95%;
    margin: auto;
    margin-bottom: 30px;
    border-radius: 10px;
    padding: 10px;
    box-shadow: inset 0 0 10px 1px #070707ea;
}

@media (max-width: 460px) {
  h1 {
    font-size: 2rem;
  }
}

#tribute-info{
    text-align: center;
}

footer{
  text-align: center;
  font-size: 1.4rem;
  padding:0 0 15px 0;
}

@media (max-width: 460px) {
  footer{
    font-size:1.2rem;
    padding:0 0 10px 0;
  }
}

#img-div{

}

#img-div #image {
    display: block;
    max-width: 100%;
    height: auto;
    }


@media (max-width: 460px){
  #img-div #image {
    display: block;
    max-width: 100%;
    height: auto;
    }

}

#img-div #img-caption{
  font-family: 'Bangers', cursive;
  font-size: 2rem;
  text-align: center;
  background-color: blueviolet;
  position: relative;
  width: 50%;
  margin: auto;
}

@media (max-width: 460px){
  #img-div #img-caption{
    font-size: 1.5rem;
  }
}

/*

  img {
    max-width: 100%;
    display: block;
    height: auto;
    margin: 0 auto;
  }

  #img-div {
    background: white;
    padding: 10px;
    margin: 0;
  }

  #img-caption {
    margin: 15px 0 5px 0;
  }

  @media (max-width: 460px) {
    #img-caption {
      font-size: 1.4rem;
    }
  }


  ul {
    max-width: 550px;
    margin: 0 auto 50px auto;
    text-align: left;
    line-height: 1.6;
  }

  li {
    margin: 16px 0;
  }
*/
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<title>CTF</title>
	<link rel="stylesheet" href="style.css">
	<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
	</head>
	<body>
	<main id="main">
	<div id="title">
	<h1>Capture The Flags</h1>
	</div>

	<div id="img-div">
	<div id="image">
	<img src="https://www.hackerone.com/sites/default/files/Icons_CTF_1.png" class="logo" alt="CTF flag">
	</div>
	<div id="img-caption">CTF is fun!</div>
	</div>

	<br>

	<div id="tribute-info">
	In computer security, Capture the Flag (CTF), a type of <a href="https://en.wikipedia.org/wiki/Wargame_(hacking)" target="_blank" >wargame</a>, is a computer security competition. CTF contests are usually designed to serve as an educational exercise to give participants experience in securing a machine, as well as conducting and reacting to the sort of attacks found in the real world (i.e., bug bounty programs in professional settings). Reverse-engineering, network sniffing, protocol analysis, system administration, programming, and cryptanalysis are all skills which have been required by prior CTF contests at <a href="https://en.wikipedia.org/wiki/DEF_CON" target="_blank">DEF CON</a>.
	<br>
	<br>
	There are three main styles of capture the flag competitions:
	<ul>
	<li>
	Attack/Defense : In an attack/defense style competition, each team is given a machine (or a small network) to defend on an isolated network. Teams are scored on both their success in defending their assigned machine(s) and on their success in attacking the other team's machines. Depending on the nature of the particular CTF game, teams may either be attempting to take an opponent's flag from their machine or teams may be attempting to plant their own flag on their opponent's machine. Two of the more prominent attack/defense CTF's are held every year at <a href="https://en.wikipedia.org/wiki/DEF_CON" target="_blank">DEF CON</a>, the largest hacker conference, and the NYU-CSAW (Cyber Security Awareness Week), the largest student cyber-security contest.
	</li>
	<br>
	<li>
	Hardware challenges : Hardware challenges usually involve getting an unknown piece of hardware and having to figure out how to bypass part of the security, e.g. using debugging ports or using a Side-channel attack. and
	</li>
	<br>
	<li>
	Jeopardy : Jeopardy style competitions usually involve multiple categories of problems, each of which contains a variety of questions of different point values and difficulties. Teams attempt to earn the most points in the competition's time frame (for example 24 hours), but do not directly attack each other. Rather than a race, this style of game play encourages taking time to approach challenges and prioritizes quantity of correct submissions over the timing.
	</li>
	<br>
	<li>
	KotH : There is a fourth type of CTF, most commonly referred to as King of the Hill (KotH). King of the Hill is similar to Attack/Defend, but instead of everyone having their own machine (or small network) to defend, there are only preconfigured ones, which require all teams to exploit them. Once a team has successfully taken over the machine, the focus shifts to defending the machine from other teams' attacks. Score is usually determined by a score reporting service on the machine, that reports a team token. When one team is able to gain access, they will remove the other team's token and insert their own, thus making them the King of the Hill.
	</li>
	</ul>
	<a href="https://ctftime.org/" id="tribute-link" target="_blank">Click here</a> to get started with CTFs and get tracking of worldwide CTFs.
	<br>
	<br>
	A few helpful resources to learn and practice CTF are:
	<a href="https://overthewire.org/" target="_blank" >OverTheWire</a>,
	<a href="https://www.hacker101.com/" target="_blank" >Hacker101</a>,
	<a href="https://picoctf.com/" target="_blank" >PicoCTF</a>,
	<a href="https://www.hackthissite.org" target="_blank" >HackThisSite</a>,
	<a href="https://www.hackthebox.eu/" target="_blank" >HackTheBox</a>,
	<a href="https://www.vulnhub.com/" target="_blank" >Vulnhub </a>
	<br>
	<br>
	Although, the only way to master CTF is via practice, there are not shortcuts but a few prerequisites to get used to CTF challenges.
	<ul>
	<li>
	Firstly you need to have "try harder" approach and offensive approach.
	</li>
	<br>
	<li>
	Secondly, a strong knowledge of networking is required,
	How the OSI and TCP/IP models work?
	Client-Server interactions, Http headers, various web technologies like HTML/CSS, JS and PHP.
	</li>
	<br>
	<li>
	Some familiarity with the linux filesystem will be helpfull.
	</li>
	<br>
	<li>
	Though not mandatory, having knowledge of any scripting language like Bash/Python apart from any regular programming is a bonus.
	</li>
	<br>
	<li>
	Also, try going through writeups on a daily basis. Remember at the end its all about understanding how things work and not being a "SCRIPT KIDDIE".
	</li>
	</ul>
	</div>
	<footer>
	<i class="fa fa-thumbs-up"></i> Wish you all the best for the journey ahead. <i class="fa fa-thumbs-up"></i>
	</footer>
	</main>
	<script src="https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js"></script>
	</body>
	</html>
	@import url('https://fonts.googleapis.com/css?family=Bangers&display=swap');

	*{
	box-sizing: border-box;
	}
	:root{
	font-size: 16px;
	margin: 0;
	padding:0;
	}

	html {
	font-size: 10px;
	}

	body{
	margin-top: 40px;
	padding: 0 10px 0 15px;
	text-align: center;
	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
	font-weight: 550 ;
	background-color:#30294eea;
	color: #fff;
	font-size: 1rem;
	text-align: justify;
	text-shadow: 1px 1px 1px black
	}

	@media(max-width: 460px) {
	body {
	font-size: 0.75rem;
	}
	}

	a{
	text-decoration: none;
	color: rgb(147, 250, 62);
	}
	a:visited {
	color: #fbfcf9;
	}
	a:hover{
	color:rgba(68, 66, 66, 0.5);
	}


	ul{
	list-style: inside;
	text-align: left;
	}

	h1{
	text-align: center;
	font-size: 4rem;
	text-shadow: 1px 1px 2px black,0 0 5px blue,4px 4px 7px rgb(81, 98, 192);
	background-color:#504b69ea;
	position: relative;
	width: 95%;
	margin: auto;
	margin-bottom: 30px;
	border-radius: 10px;
	padding: 10px;
	box-shadow: inset 0 0 10px 1px #070707ea;
	}

	@media (max-width: 460px) {
	h1 {
	font-size: 2rem;
	}
	}

	#tribute-info{
	text-align: center;
	}

	footer{
	text-align: center;
	font-size: 1.4rem;
	padding:0 0 15px 0;
	}

	@media (max-width: 460px) {
	footer{
	font-size:1.2rem;
	padding:0 0 10px 0;
	}
	}

	#img-div{

	}

	#img-div #image {
	display: block;
	max-width: 100%;
	height: auto;
	}


	@media (max-width: 460px){
	#img-div #image {
	display: block;
	max-width: 100%;
	height: auto;
	}

	}

	#img-div #img-caption{
	font-family: 'Bangers', cursive;
	font-size: 2rem;
	text-align: center;
	background-color: blueviolet;
	position: relative;
	width: 50%;
	margin: auto;
	}

	@media (max-width: 460px){
	#img-div #img-caption{
	font-size: 1.5rem;
	}
	}

	/*

	img {
	max-width: 100%;
	display: block;
	height: auto;
	margin: 0 auto;
	}

	#img-div {
	background: white;
	padding: 10px;
	margin: 0;
	}

	#img-caption {
	margin: 15px 0 5px 0;
	}

	@media (max-width: 460px) {
	#img-caption {
	font-size: 1.4rem;
	}
	}


	ul {
	max-width: 550px;
	margin: 0 auto 50px auto;
	text-align: left;
	line-height: 1.6;
	}

	li {
	margin: 16px 0;
	}
	*/