forked from ShaughnAnderson94/ApplicationWebsite
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
121 lines (100 loc) · 6.79 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
<!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">
<title>application website</title>
<link href="styles/styles.css" rel="stylesheet" />
</head>
<body>
<div class="wrapper">
<nav>
<ul>
<li><p id="navMe">About Me</p></li>
<li><p id="navHobby">Hobby page</p></li>
<li><p id="navGallery">Project Gallery</p></li>
<li><p id="navMovie">Movie Database</p></li>
<li><p id="navGame">Game</p></li>
<li><p id="navApp">Application</p></li>
</ul>
</nav>
<h1>Shaughn Anderson's Application Website</h1>
<section class="me-flex-container">
<div class="mbox one">
<img src="images/aboutMe.jpg" alt="a photo of a person with curly brown hair smiling at the camera. They are wearing a black haltertop dress with several small golden necklaces and thick blue rimmed glasses" />
</div>
<div class="mbox two">
<p>My name is Shaughn Anderson. I am an American transplant to the UK currently a science and math teacher. I have long been interested in coding. I took a short course in highschool and during my masters thesis learned bits and pieces of R to help track population changes in UK social wasp species. Outside of coding and teaching my hobbies include roller derby, fire spinning and as you will see later nail art. Founders and Coders has been an amazing opportunity and I’ve really enjoyed developing my coding alongside and with the guidance of the FAC community. I hope you find my application worthy and that I can take coding to the next level.</p>
</div>
<div class="mbox three">
<button id="hideMe">Hide Section</button><br>
<a href="https://github.com/ShaughnAnderson94">View github profile</a>
</div>
</section>
<section class="hobby-flex-container">
<div class="hbox one">
<img src="images/Nail-art.png" alt="a screen shot of a well laid out website with information about nail art as a hobby" />
</div>
<div class="hbox two">
<p>In this project I learned the basics of html css and a little java script. This site is mostly notable in that it displays information in a variety of formats. We see in this document titles text lists images links and data being read in from javascript. There is also some artistic directions and the site has a lot of color. I don't know if it looks perfect but I was interested in moving on and getting to learn more javascript so the styling was left as it was.
</p>
</div>
<div class="hbox three">
<button id="hideHobby">Hide Section</button><br>
<a href="https://shaughnanderson94.github.io/Hobby-project/">View Site</a>
</div>
</section>
<section class="gallery-flex-container">
<div class="gbox one">
<img src="images/Gallery.png" alt="a screen shot of a well laid out digital gallery of various FAC projects" />
</div>
<div class="gbox two">
<p>In this project I created a simple way of showing off what I had done during my time in founders and coders. This application website is in some ways a more functional version of the initial gallery. This gallery pushed me to develop better css skills and taught me to use flexbox so that websites can adapt to smaller screens in a more sensible way. It also gave me an opportunity to build more complicated Javascript through the introduction of buttons.
</p>
</div>
<div class="gbox three">
<button id="hideGallery">Hide Section</button><br>
<a href="https://shaughnanderson94.github.io/Project-gallery/">View Site</a>
</div>
</section>
<section class="movie-flex-container">
<div class="mobox one">
<img src="images/Movie.png" alt="a screen shot of a well laid out film database where users can search and add films" />
</div>
<div class="mobox two">
<p>In this project I really sunk my teeth into Javascript and learned to do more complex coding. I did not do much styling here since it was not a requirement. Instead of sorting functions I opted to make a search bar for the database. This resembles a simple version of IMDB in that you can search a movie and get information about it. Also users can add more movies if they are interested in films by someone other than Wes Anderson. I was really proud of this project. It required the most of me and I felt like I learned a lot about making websites work when I built it.
</p>
</div>
<div class="mobox three">
<button id="hideMovie">Hide Section</button><br>
<a href="https://shaughnanderson94.github.io/Movie--Database/">View Site</a>
</div>
</section>
<section class="game-flex-container">
<div class="gabox one">
<img src="images/Game.png" alt="A game of tic tac toe in progess" />
</div>
<div class="gabox two">
<p>Coding the game was a fun exercise at the end of the application. There was not much structure and it was a chance to just pick a suggested idea and use logic and javascript to make a thing work. It was a cool surprise to realize I knew enough to make a game already. Tic tac toe is not the most complex of games but at the end of only 2 months of coding I was proud that I was able to come up with code to make this run. It could probably be more elegant but that will come with time.</p>
</div>
<div class="gabox three">
<button id="hideGame">Hide Section</button><br>
<a href="https://shaughnanderson94.github.io/Game/">View Site</a>
</div>
</section>
<section class="app-flex-container">
<div class="abox one">
<img src="images/aplication.jpeg" alt="A well dressed drawing of a programer looks out of the frame" />
</div>
<div class="abox two">
<p>Why I would be a good part of the program. Like I mentioned in the about me I really enjoy coding and will bring a curious attitude to the course. I think another strength of mine is my background as a teacher. In this class we are learning together and the experience of explaining what you understand to others helps a lot when I am working on a problem with my fellow students. I also think another advantage I have is that I have attended all the coding sessions so far and have gotten to know a lot of the other coders I would be working with if I was brought onto the next step in the course.</p>
</div>
<div class="abox three">
<button id="hideApp">Hide Section</button><br>
</div>
</section>
</div>
<script src="scripts/main.js"></script>
</body>
</html>