-
Notifications
You must be signed in to change notification settings - Fork 29
Expand file tree
/
Copy pathresources.html
More file actions
245 lines (204 loc) · 14.2 KB
/
Copy pathresources.html
File metadata and controls
245 lines (204 loc) · 14.2 KB
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
<!DOCTYPE html>
<html>
<head>
<!-- Metadata for Search Engines like Google -->
<meta charset="utf-8">
<title>Women Techmakers Hamburg: Resources</title>
<meta name="description" content="This group is the Hamburg chapter of the global Women Techmakers initiative. We are part of the Google Developer Group Hamburg.">
<!-- Responsive and Mobile Friendly Meta Tag -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Facebook Preview Thumbnail Image -->
<meta property="og:image" content="http://moinworld.github.io/img/wtm-fb-thumb.png">
<!-- Favicons for the Browsers and apple Devices -->
<link rel="shortcut icon" href="img/favicon.ico">
<link rel="apple-touch-icon" href="img/apple-favicon.png">
<!-- Google Font -->
<link href='https://fonts.googleapis.com/css?family=Roboto:100,300,500' rel='stylesheet' type='text/css'>
<!-- CSS Stylesheets -->
<link rel="stylesheet" href="css/normalize.css" media="all">
<link rel="stylesheet" href="css/col.css" media="all">
<link rel="stylesheet" href="css/style.css" media="all">
</head>
<body>
<!-- Google Tag Manager -->
<noscript><iframe src="//www.googletagmanager.com/ns.html?id=GTM-KN53WC" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src='//www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);})(window,document,'script','dataLayer','GTM-KN53WC');</script>
<!-- End Google Tag Manager -->
<header class="header">
<div class="wrapper header__wrapper">
<!-- Logo -->
<h1 class="logo"><a href="/">Women Techmakers Hamburg</a></h1>
<!-- Mobile Navigation Open Button -->
<a href="#nav" class="menu--open visible-mobile" title="Open Navigation">Menu</a>
<!-- Navigation -->
<nav id="nav" class="nav transition-all">
<!-- Site Navigation -->
<ul class="nav__site">
<li><a href="/">Home</a></li>
<li><a href="about.html">About</a></li>
<li><a class="active" href="resources.html">Resources</a></li>
<li><a href="events.html">Events</a></li>
<li><a href="community.html">Community</a></li>
<li><a href="mentors.html">Mentors</a></li>
</ul>
<!-- Social Navigation -->
<ul class="nav__social">
<li><a href="https://twitter.com/wtm_hamburg/" target="_blank"><i class="fa fa-twitter fa-2x" aria-hidden="true"></i></a></li>
<li><a href="https://www.facebook.com/womentechmakershamburg/" target="_blank"><i class="fa fa-facebook fa-2x" aria-hidden="true"></i></a></li>
<li><a href="https://github.com/WTMHH/" target="_blank"><i class="fa fa-github fa-2x" aria-hidden="true"></i></a></li>
</ul>
</nav>
<!-- Mobile Navigation Close Button -->
<a href="#" class="menu--close visible-mobile transition-all" title="Close Navigation">×</a>
</div>
</header>
<!-- Resources Section Starts -->
<main>
<section class="sec--resources sec--content">
<div class="wrapper header__wrapper">
<!-- Headline -->
<div class="section group">
<h2 class="h2">Resources</h2>
</div>
<!-- Column Group: 3 columns -->
<div class="section group">
<!-- Column #1 -->
<article class="col span_1_of_3">
<h3 class="h3">Workshop Material</h3>
<!-- Unordered List of Links -->
<ul>
<li><a href="docs/github/wtmhh-git-github-webhosting.pdf" target="_blank" title="WTM HH Git, GitHub & Web Hosting PDF Documentation">Git, GitHub & Web Hosting</a></li>
<li><a href="docs/html-css/wtmhh-html-css.pdf" target="_blank" title="WTM HH HTML & CSS PDF Documentation">HTML & CSS</a></li>
<li><a href="docs/js/wtmhh-js.pdf" target="_blank" title="WTM HH JavaScript PDF Documentation">JavaScript</a></li>
<li><a href="docs/law/Getting-Insights-from-Google-Analytics-and-Inspectlet-for-Getting-Insights-from-Google-Analytics-and-Inspectlet-for-moinworld.de.pdf" target="_blank" title="WTM HH Google Analytics PDF Documentation">Web Analytics Insights</a></li>
<li><a href="docs/law/Datenschutz-moinworld.de.pdf" target="_blank" title="WTM HH Data Protection Law PDF Documentation">German Data Protection Law</a></li>
</ul>
</article>
<!-- Column #2 -->
<article class="col span_1_of_3">
<h3 class="h3">Workshop Tasks</h3>
<!-- Unordered List of Links -->
<ul>
<li><a href="docs/html-css/wtmhh-handout-home.pdf" target="_blank" title="WTM HH HTML & CSS PDF Task">Build our Home page</a></li>
<li><a href="docs/html-css/wtmhh-handout-about.pdf" target="_blank" title="WTM HH HTML & CSS PDF Task">Build our About page</a></li>
<li><a href="docs/html-css/wtmhh-handout-resources.pdf" target="_blank" title="WTM HH HTML & CSS PDF Task">Build our Resources page</a></li>
<li><a href="docs/html-css/wtmhh-handout-events.pdf" target="_blank" title="WTM HH HTML & CSS PDF Task">Build our Events page</a></li>
<li><a href="docs/github/wtmhh-handout-git.pdf" target="_blank" title="WTM HH Git & GitHub PDF Task">Contribute to our Community page</a></li>
<li><a href="https://firebase.google.com/docs/hosting/" target="_blank" title="Firebase Hosting">Firebase Hosting</a></li>
<li><a href="https://firebase.google.com/docs/web/setup" target="_blank" title="Firebase Auth">Firebase Authentification</a></li>
<li><a href="docs/iot/iot_readme_en.html" target="_blank" title="Firebase IoT">Firebase IoT/Lego Smart Home - English</a></li>
<li><a href="docs/iot/iot_readme_de.html" target="_blank" title="Firebase IoT">Firebase IoT/Lego Smart Home - Deutsch</a></li>
</ul>
</article>
<!-- Column #3 -->
<article class="col span_1_of_3">
<h3 class="h3">Cheat Sheets</h3>
<!-- Unordered List of Links -->
<ul>
<li><a href="http://www.justinaguilar.com/animations/" target="_blank">CSS3 Animation</a></li>
<li><a href="http://www.sitepoint.com/web-foundations/css-selectors/" target="_blank">CSS Selectors</a></li>
<li><a href="https://coolestguidesontheplanet.com/getting-selective-css-styling/" target="_blank">CSS Styling Selectors</a></li>
<li><a href="http://www.studyweb.com/wp-content/uploads/html5_cheat_sheet_tags.png" target="_blank">HTML</a></li>
<li><a href="https://www.bluehost.com/blog/website-design/html-css-cheat-sheet-infographic-4181/" target="_blank">HTML and CSS</a></li>
<li><a href="http://makeawebsitehub.com/the-html-5-mega-cheat-sheet/" target="_blank">HTML: The Mega</a></li>
</ul>
</article>
</div>
<!-- END Column Group -->
<!-- Column Group: 3 columns -->
<div class="section group">
<!-- Column #1 -->
<article class="col span_1_of_3">
<h3 class="h3">Tutorials and Forums</h3>
<!-- Unordered List of Links -->
<ul>
<li><a href="https://css-tricks.com/" target="_blank">CSS Tricks: Blog, Tutorials, Snippets, Forum</a></li>
<li><a href="https://www.javascript.com/" target="_blank" title="Learn JavaScript">JavaScript Site</a></li>
<li><a href="https://www.khanacademy.org/computing/computer-programming/html-css" target="_blank">Khan Academy: Online Tutorial on HTML and CSS</a></li>
<li><a href="http://learnlayout.com/" target="_blank">Learn CSS Layout</a></li>
<li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript" target="_blank">MDN: Learning JavaScript</a></li>
<li><a href="http://stackoverflow.com/">Stackoverflow: Community Forum to Ask or Answer Coding Questions</a></li>
<li><a href="http://www.w3schools.com/" target="_blank">W3 Schools: Guide and Tutorials for CSS, HTML, JS, PHP</a></li>
<li><a href="http://devdocs.io/" target="_blank">Our favourite documentation site</a></li>
<li><a href="https://www.youtube.com/user/Firebase" target="_blank">Youtube Channel for Firebase</a></li>
</ul>
</article>
<!-- Column #2 -->
<article class="col span_1_of_3">
<h3 class="h3">Games</h3>
<!-- Unordered List of Links -->
<ul>
<li><a href="http://thehtml5quiz.com/" target="_blank">Name the HTML5 Elements</a></li>
<li><a href="http://www.flexboxdefense.com/" target="_blank">Learn CSS Flexbox with Defense</a></li>
<li><a href="http://flexboxfroggy.com/" target="_blank">Learn CSS Flexbox with Froggy</a></li>
<li><a href="https://eraseallkittens.com" target="_blank">Learn HTML</a></li>
</ul>
</article>
<!-- Column #3 -->
<article class="col span_1_of_3">
<h3 class="h3">Online Courses</h3>
<!-- Unordered List of Links -->
<ul>
<li><a href="https://www.codecademy.com/" target="_blank" title="Learn to Code for Free">Codecademy</a></li>
<li><a href="https://teamtreehouse.com" target="_blank" title="Learn to Code or Design">Treehouse</a></li>
<li><a href="https://www.skillshare.com/classes/technology?via=homepage" target="_blank" title="Learn to Code or Design">Skillshare</a></li>
</ul>
</article>
</div>
<!-- END Column Group -->
<!-- Column Group: 3 columns -->
<div class="section group">
<!-- Column #1 -->
<article class="col span_1_of_3">
<h3 class="h3">Validation Tools</h3>
<!-- Unordered List of Links -->
<ul>
<li><a href="http://caniuse.com/" target="_blank" title="Caniuse Website">CSS3 Properties Browser Support Matrix</a></li>
<li><a href="https://jigsaw.w3.org/css-validator/" target="_blank" title="W3C CSS Validation Service">CSS Validation</a></li>
<li><a href="http://csslint.net/" target="_blank" title="CSS Lint">CSS Validator</a></li>
<li><a href="https://validator.w3.org/#validate_by_input" target="_blank" title="W3C Markup Validation Service">HTML Validation</a></li>
</ul>
</article>
<!-- Column #2 -->
<article class="col span_1_of_3">
<h3 class="h3">Online Editors</h3>
<!-- Unordered List of Links -->
<ul>
<li><a href="http://codepen.io/" target="_blank" title="Create and Edit your HTML, CSS and JS">CodePen</a></li>
<li><a href="https://jsbin.com/" target="_blank" title="Create and Edit your HTML, CSS and JS">JSBin</a></li>
<li><a href="https://jsfiddle.net/" target="_blank" title="Create and Edit your HTML, CSS and JS">JSFiddle</a></li>
</ul>
</article>
<!-- Column #3 -->
<article class="col span_1_of_3">
<h3 class="h3">Frameworks</h3>
<!-- Unordered List of Links -->
<ul>
<li><a href="http://muellergridsystem.com/" target="_blank">MUELLER: Modular Grid System </a></li>
<li><a href="http://www.responsivegridsystem.com/" target="_blank">Responsive Grid System Framework</a></li>
</ul>
</article>
</div>
<!-- END Column Group -->
</div>
</section>
</main>
<!-- Resources Section Ends -->
<!-- Sticky scroll link -->
<button title="Back to top" id="scroll" class="scroll transition-all">
<img class="scroll__icon" src="img/arrow_drop_up.svg" />
</button>
<footer class="footer">
<div class="wrapper header__wrapper">
<p>
© 2016 Women Techmakers Hamburg.<br>
<a href="imprint.html">Legal Disclosure</a>
</p>
</div>
</footer>
<!-- Font Awesome -->
<script src="https://use.fontawesome.com/5ac618c67d.js"></script>
<!-- Include our scroll-to-top JS file -->
<script src="js/scroll-to-top.js"></script>
</body>
</html>