-
Notifications
You must be signed in to change notification settings - Fork 2
/
Copy pathindex.html
478 lines (430 loc) · 28.5 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
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
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>台科大程式設計研究社</title>
<meta property="og:title" content="台科大程式設計研究社">
<meta property="og:image" content="http://ntustcoding.club/build/images/logo.png">
<meta property="og:description" content="我們的目標並不是培養很多程式設計工程師，而是讓每個人都能了解程式語言，就如同每個人都會學英語、國文一樣，我們的生活一切都和資訊息息相關，我們難道不應該對電腦多了解一些嘛？並不是所有人都必須學會寫程式，但至少，你需要知道程式在做些什麼。">
<meta property="og:url" content="http://ntustcoding.club/">
<script src="build/build.min.js"></script>
<!-- <script src="//localhost:35729/livereload.js"></script> -->
<link rel="stylesheet" href="build/css/lightbox.css" />
<!--[if lte IE 9]><link rel="stylesheet" href="build/css/ie/v9.css" /><![endif]-->
<!--[if lte IE 8]><link rel="stylesheet" href="build/css/ie/v8.css" /><![endif]-->
</head>
<body class="landing">
<header id="header" class="skel-layers-fixed" style="background: #262732;">
<h1 id="logo"><a class="scrolly" href="#banner">台科大程式設計研究社</a></h1>
<nav id="nav">
<ul>
<li><a target="_blank" href="https://docs.google.com/forms/d/1JC_de2qvOEdH8vVmEH06FykRE8UoqEIt0sDoa3oR4qo/viewform">電子報</a></li>
<li class="opener">
<a href="#one">了解更多</a>
<ul>
<li><a href="#four">社團課程</a></li>
<li><a href="#seven">企業參訪</a></li>
<li><a href="#eight">主題演講</a></li>
<li><a href="#night">成果發表</a></li>
</ul>
</li>
<li><a target="_blank" href="https://www.facebook.com/groups/ntust.coding/">討論區</a></li>
<!-- <li><a target="_blank" class="button" href="http://ntust-coding-club.kktix.cc/events/06cde201">報名茶會</a></li> -->
</ul>
</nav>
</header>
<section id="banner">
<div class="content">
<header class="text-center">
<img class="12u(xsmall) 8u(small)" src="build/images/logo.svg" alt="">
<p>
<a href="https://docs.google.com/forms/d/1JC_de2qvOEdH8vVmEH06FykRE8UoqEIt0sDoa3oR4qo/viewform" target="_blank" class="button 3u(small)">電子報</a>
<a href="#one" class="button big scrolly 5u(small)">了解更多</a>
<a href="https://www.facebook.com/groups/ntust.coding/" target="_blank" class="button 3u(small)">討論區</a>
</p>
</header>
</div>
<a href="#one" class="goto-next scrolly">Next</a>
</section>
<section id="one" class="spotlight style1 right">
<span class="image fit main"><img src="build/images/background/one.jpg" alt=""></span>
<div class="content">
<header class="major">
<h2>為什麼要學程式設計？</h2>
</header>
<div class="row text-left">
<p>你是否想過未來十年，世界會是什麼樣子？如果你想過，你會知道，那是個完全不同的世界。</p>
<p>看看你的身邊，一早起床我們騎 Ubike 去上學；中午，我們用 MOS Order App 訂午餐吃；下午跟朋友有約，拿起 App 招計程車；到了晚上回到家，我們用 Facebook 跟同學聊天打屁。 </p>
<p>未來，每個人的生活都將和資訊密不可分，醫生會用大數據來判斷病情，健身教練也會用電腦來幫客戶制定運動計畫，老師會透過網路教學，你，還不趕快來學程式嘛？</p>
</div>
</div>
<a href="#two" class="goto-next scrolly">Next</a>
</section>
<section id="two" class="wrapper style4 fade-up">
<div class="container">
<div class="row">
<div class="12u">
<header class="major">
<h2>關於台科程式社</h2>
</header>
<div class="row">
<div class="6u 12u(small) 12u(medium)">
<p>我們致力於在台科推動程式設計教育，開辦課程、講座，並舉辦聚會，希望能讓台科大的同學，不管是不是資訊相關科系的，都能有機會了解程式設計之美，並且讓台科大對資訊技術有興趣的同學能夠在這裡互相交流。</p>
<p>我們的目標並不是培養很多程式設計工程師，而是讓每個人都能了解程式語言，就如同每個人都會學英語、國文一樣，我們的生活一切都和資訊息息相關，我們難道不應該對電腦多了解一些嘛？並不是所有人都必須學會寫程式，但至少，你需要知道程式在做些什麼。</p>
<p>選擇 Scratch 這個程式語言作為主要教學教材，就是為了達成這個目標，不管你是誰、你來自哪裡，只要你有興趣，都歡迎你加入我們！</p>
</div>
<div class="6u 12u(small) 12u(medium) text-center">
<a href="build/images/club_activity/16384868866_13cec99781_o.jpg" data-lightbox="gallery" data-title="Python 社課"><img style="width:30%;height:100%;float:right;margin:3px;" src="build/images/club_activity/thumbnail/16384868866_13cec99781_o.jpg" alt=""></a>
<a href="build/images/club_activity/IMG_4774.jpg" data-lightbox="gallery" data-title="AngularJS 主題演講"><img style="width:30%;height:100%;float:right;margin:3px;" src="build/images/club_activity/thumbnail/IMG_4774.jpg" alt=""></a>
<a href="build/images/club_activity/IMG_4791.jpg" data-lightbox="gallery" data-title="Python 社課"><img style="width:30%;height:100%;float:right;margin:3px;" src="build/images/club_activity/thumbnail/IMG_4791.jpg" alt=""></a>
<a href="build/images/club_activity/IMG_4396.jpg" data-lightbox="gallery" data-title="社團博覽會"><img style="width:30%;height:100%;float:right;margin:3px;" src="build/images/club_activity/thumbnail/IMG_4396.jpg" alt=""></a>
<a href="build/images/club_activity/P1070895.jpg" data-lightbox="gallery" data-title="創客世代冬令營"><img style="width:30%;height:100%;float:right;margin:3px;" src="build/images/club_activity/thumbnail/P1070895.jpg" alt=""></a>
<a href="build/images/club_activity/IMG_4699.jpg" data-lightbox="gallery" data-title="Python 社課"><img style="width:30%;height:100%;float:right;margin:3px;" src="build/images/club_activity/thumbnail/IMG_4699.jpg" alt=""></a>
<a href="build/images/club_activity/IMG_4741.jpg" data-lightbox="gallery" data-title="AngularJS 主題演講"><img style="width:30%;height:100%;float:right;margin:3px;" src="build/images/club_activity/thumbnail/IMG_4741.jpg" alt=""></a>
<a href="build/images/club_activity/IMG_4798.jpg" data-lightbox="gallery" data-title="創客世代冬令營"><img style="width:30%;height:100%;float:right;margin:3px;" src="build/images/club_activity/thumbnail/IMG_4798.jpg" alt=""></a>
<a href="build/images/club_activity/IMG_5385.jpg" data-lightbox="gallery" data-title="社團期末聚餐"><img style="width:30%;height:100%;float:right;margin:3px;" src="build/images/club_activity/thumbnail/IMG_5385.jpg" alt=""></a>
</div>
</div>
<br>
</div>
</div>
</div>
<a href="#three" class="scrolly goto-next">Next</a>
</section>
<section id="three" class="spotlight style2 left">
<span class="image fit main"><img src="build/images/background/three.jpg" alt=""></span>
<div class="content">
<header class="major">
<h2>名人見證</h2>
</header>
<div class="row">
<blockquote>
「不要只是買新的電腦遊戲而已，自己做一個吧！不要只是下載最新的 App 而已，自己設計一個吧！不要只是滑手機而已，自己寫個程式吧！」<small class="text-right"> <i>--美國總統歐巴馬</i></small>
</blockquote>
<!-- <blockquote>
「想想，你可以在大學寢室裡開始一項事業，你可以讓一群從未有過創業經歷的人們在一起工作，打造一件幾億人每天都在使用的東西，想想很瘋狂是嘛？但這是真實發生的事情」<small class="text-right"> <i>--臉書創辦人</i></small>
</blockquote> -->
</div>
<div class="row">
<iframe class="12u" width="450" height="253" src="https://www.youtube.com/embed/nKIu9yen5nc?rel=0" frameborder="0" allowfullscreen></iframe>
</div>
</div>
<a href="#four" class="goto-next scrolly">Next</a>
</section>
<section id="four" class="wrapper style1 fade-up">
<div class="container">
<header class="major">
<h2> js工作坊 <small>社團課程</small></h2>
</header>
<div class="box alt">
<div class="row">
<div class="6u 12u(medium)">
<p>Scratch是美國麻省理工學院所發展的一套全新電腦圖形化程式語言，特色是把重點放在程式設計思維而不是程式設計的語法，並透過視覺化的方式使學習更加快速。 </p>
<p>這是一堂為新手專門開得課程，特別選用專門設計給新手的Scratch作為工具，這堂課的規劃是分為兩個段落，前半段是讓同學們初步培養程式思維以及了解Scratch工具使用方法的基礎課程，後半段我們將會改以主題式的方式靈活使同學們運用程式設計思維，希望在課程中大家可以建立電腦程式如何設計的觀念，更重要的是發展出運用電腦創作和解決問題的重要能力。</p>
<h4>課程資訊</h4>
<ul>
<li>上課時間：週一晚間 7:00－9:00</li>
<li>上課地點：台科大教室（稍後公開）</li>
<li>適合程度：任何科系的同學都歡迎，不需要有任何程式設計基礎。</li>
<li>名額限制：20 人</li>
</ul>
<h4>注意事項</h4>
<ul>
<li>需自備筆記型電腦</li>
<li>新手限定的課程</li>
</ul>
<h4>參考資料</h4>
<ul>
<li><a target="_blank" href="http://scratch.mit.edu/">Scratch 官方網站</a></li>
<li><a target="_blank" href="http://scratch.mit.edu/studios/522331/">哈佛學生的 Scratch 作品</a></li>
<li><a target="_blank" href="http://www.inside.com.tw/2014/10/17/everybody-learn-cs-1-scratch">MIT 為孩子量身打造的程式語言</a></li>
<li><a target="_blank" href="https://scratch.mit.edu/studios/338158/">Top 50 Scratch Games</a></li>
</ul>
</div>
<div class="6u 12u(medium)">
<div class="table-course text-center">
<table>
<tr>
<td>第 1 堂</td>
<td>Scratch 基礎入門 (1)</td>
</tr>
<tr>
<td>第 2 堂</td>
<td>Scratch 基礎入門 (2)</td>
</tr>
<tr>
<td>第 3 堂</td>
<td>Scratch 基礎入門 (3)</td>
</tr>
<tr>
<td>第 4 堂</td>
<td>主題社課 彈跳球</td>
</tr>
<tr>
<td>第 5 堂</td>
<td>主題社課 Zoidtrip</td>
</tr>
<tr>
<td>第 6 堂</td>
<td>主題社課 電流急急樂</td>
</tr>
<tr>
<td>第 7 堂</td>
<td>主題社課 電流急急樂</td>
</tr>
<tr>
<td>第 8 堂</td>
<td>主題社課 Google 小恐龍</td>
</tr>
<tr>
<td>第 9 堂</td>
<td>成果發表</td>
</tr>
<tr>
<td>第 10 堂</td>
<td>成果發表</td>
</tr>
</table>
<!-- <a href="http://ntust-coding-club.kktix.cc/events/scratch-courses" target="_blank" class="button special big fit">立刻報名</a> -->
</div>
</div>
</div>
</div>
<a href="#five" class="scrolly goto-next">Next</a>
</div>
</section>
<section class="spotlight style2 sperate">
<span class="image fit main">
<img src="build/images/background/test2.jpg" alt="">
</span>
</section>
<section id="five" class="wrapper style3 fade-down">
<div class="container">
<header class="major">
<h2>JavaScript <small>社團課程</small></h2>
</header>
<div class="box alt">
<div class="row">
<div class="6u 12u(medium)">
<p>JavaScript 是一種直譯式程式語言，被廣泛運用在動態網頁的互動上，HTML, CSS 和 JavaScript 是網頁設計必學的三種語言，JavaScript 也可以用來開發遊戲、應用程式、資料庫應用等，用途極廣。</p>
<p>本社課針對沒有程式基礎的人所設計，以 JavaScript 基本語法帶領學員建立程式邏輯、了解網頁設計、進而做出簡單且實用的 App。</p>
<h4>課程資訊</h4>
<ul>
<li>上課時間：週五晚間 7:00－9:00</li>
<li>上課地點：台科大教室（稍後公開）</li>
<li>適合程度：新手課程，不需任何程式基礎，歡迎任何科系。</li>
<li>名額限制：25 人</li>
</ul>
<h4>注意事項</h4>
<ul>
<li>需自備筆記型電腦</li>
</ul>
</div>
<div class="6u 12u(medium)">
<div class="table-course text-center">
<table>
<tr>
<td>第 1 堂</td>
<td>JavaScript 基礎入門</td>
</tr>
<tr>
<td>第 2 堂</td>
<td>JavaScript 基礎語法 (1)</td>
</tr>
<tr>
<td>第 3 堂</td>
<td>JavaScript 基礎語法 (2)</td>
</tr>
<tr>
<td>第 4 堂</td>
<td>JavaScript 基礎語法 (3)</td>
</tr>
<tr>
<td>第 5 堂</td>
<td>主題 (一) - p5.js</td>
</tr>
<tr>
<td>第 6 堂</td>
<td>主題 (二) - Paper.js</td>
</tr>
<tr>
<td>第 7 堂</td>
<td>主題 (三) - D3.js</td>
</tr>
</table>
</div>
<!-- <a href="http://ntust-coding-club.kktix.cc/events/aa8d3e20" target="_blank" class="button special big fit">立刻報名</a> -->
</div>
</div>
</div>
</div>
<a href="#six" class="scrolly goto-next">Next</a>
</section>
<section class="spotlight style2 sperate">
<span class="image fit main">
<img src="build/images/background/hackntu.jpg" alt="">
</span>
</section>
<section id="six" class="wrapper style3 fade-down">
<div class="container">
<header class="major">
<h2>Python <small>社團課程</small></h2>
</header>
<div class="box alt">
<div class="row">
<div class="6u 12u(medium)">
<p>Python 是一個擁有超過二十年的歷史，被廣泛應用在科學計算、資訊安全、網站系統、系統管理⋯等各種領域的程式語言，用途十分廣泛，語法簡單，但絲毫不減它的威力。</p>
<p>本課程給已經有程式基礎的同學參與，帶領大家學習、體驗程式設計更深層的美，以及其他關於電腦科學的知識。這個課程沒有課表和預定進度，一開始會教大家 Python 的基本語法，以及一些常用程式庫的用法，接下來的內容會由參與課程的大家一起決定！</p>
<h4>課程資訊</h4>
<ul>
<li>上課時間：週一晚間 7:00 - 9:00</li>
<li>上課地點：台科大教室（稍後公開）</li>
<li>適合程度：需熟練任何一種程式語言。</li>
<li>名額限制：20 人</li>
</ul>
<h4>注意事項</h4>
<ul>
<li>本課程是設計給已經會寫程式的同學參加的，所以請至少會寫任何一種程式語言再報名參加。</li>
<li>需自備筆記型電腦</li>
</ul>
</div>
<div class="6u 12u(medium)">
<div class="table-course text-center">
<table>
<tr>
<td>第 1 堂</td>
<td>Python 介紹與基本語法</td>
</tr>
<tr>
<td>第 2 堂</td>
<td>內建函式與檔案存取</td>
</tr>
<tr>
<td>第 3 堂</td>
<td>物件與內建模組</td>
</tr>
<tr>
<td>第 4 堂</td>
<td>用 Bottle.py 寫網站</td>
</tr>
<tr>
<td>第 5 堂</td>
<td>主題共議</td>
</tr>
<tr>
<td>第 6 堂</td>
<td>主題共議</td>
</tr>
<tr>
<td>第 7 堂</td>
<td>主題共議</td>
</tr>
<tr>
<td>第 8 堂</td>
<td>主題共議</td>
</tr>
<tr>
<td>第 9 堂</td>
<td>主題共議</td>
</tr>
<tr>
<td>第 10 堂</td>
<td>主題共議</td>
</tr>
</table>
</div>
<!-- <a href="http://ntust-coding-club.kktix.cc/events/aa8d3e20" target="_blank" class="button special big fit">立刻報名</a> -->
</div>
</div>
</div>
</div>
<a href="#seven" class="scrolly goto-next">Next</a>
</section>
<section id="seven" class="spotlight style2 left">
<span class="image fit main"><img src="build/images/background/six.jpg" alt=""></span>
<div class="content">
<header class="major">
<h2>企業參訪</h2>
</header>
<div class="box alt">
<div class="row text-left">
<p>為了讓同學能夠更加熟悉業界的運作方式，了解業界所在使用的技術，程式社將會舉辦企業參訪，目前正在和 <b>Yahoo</b>、<b>Mozilla</b>、<b>KKBOX</b> 等企業接洽中。</p>
<p>企業參訪會採用社員優先報名的方式，有多餘名額在釋出給一般同學，待洽談完成後會將詳細資訊公告於此，如果您有興趣也可以訂閱我們的<a target="_blank" href="https://docs.google.com/forms/d/1JC_de2qvOEdH8vVmEH06FykRE8UoqEIt0sDoa3oR4qo/viewform">電子報</a>。</p>
</div>
</div>
</div>
<a href="#eight" class="goto-next scrolly">Next</a>
</section>
<section id="eight" class="speech wrapper style1 fade-down">
<div class="container">
<header class="major">
<h2>主題演講</h2>
</header>
<div class="box alt">
<div class="row text-left">
<div class="8u -2u 12u(small)">
<div class="row">
<p>資訊技術日新月異，我們固定每月舉辦一至兩場的主題演講，邀請業界講師向同學分享最新最酷的技術，內容涵蓋程式設計前後端、雲端、大數據以及資訊安全。</p>
<p>在上學期，我們舉辦了三場主題演講，而這學期，預計也會維持每月一場的安排，邀請講師來分享，如果同學有特別想聽的主題，也歡迎直接透過<a href="https://www.facebook.com/ntust.coding" target="_blank">粉絲團</a>或是<a target="_blank" href="mailto:[email protected]">電子郵件</a>和我們聯絡！</p>
</div>
<h4>上學期曾舉辦</h4>
<div class="row">
<div class="4u 8u(small) -2u(small)"><a style="border:0px;" href="http://ntust-coding-club.kktix.cc/events/angularjs" target="_blank"><span class="image"><img src="build/images/poster/Angular.jpg" class="12u" alt=""></span><p class="image-title text-center">前端工程的極致精品<br>AngularJS 開發框架</p></a></div>
<div class="4u 8u(small) -2u(small)"><a style="border:0px;" href="http://ntust-coding-club.kktix.cc/events/nccxtdoh-1124" target="_blank"><span class="image"><img src="build/images/poster/TDOH.jpg" class="12u" alt=""></span><p class="image-title text-center">TDOHacker 校園資安講座<br>你今天被黑了沒</p></a></div>
<div class="4u 8u(small) -2u(small)"><a style="border:0px;" href="http://ntust-coding-club.kktix.cc/events/ntust-docker" target="_blank"><span class="image"><img src="build/images/poster/Docker.jpg" class="12u" alt=""></span><p class="image-title text-center">輕量級虛擬化技術<br>Docker 入門引導</p></a></div>
</div>
</div>
</div>
</div>
</div>
<a href="#night" class="goto-next scrolly">Next</a>
</section>
<section id="night" class="spotlight style2 right">
<span class="image fit main"><img src="build/images/background/eight.jpg" alt=""></span>
<div class="content">
<header class="major">
<h2>成果發表</h2>
</header>
<div class="box alt">
<div class="row text-left">
<p>你曾夢想過有一天，可以在上百人面前發表自己的作品麻？為了滿足大家的夢想，也訓練大家上台發表的能力，程式社在最後三堂社課，將會有一系列的課程，帶領所有社員用 Scratch 做出作品，並上台發表。</p>
<p>你可以選擇做個簡單的遊戲，例如貪吃蛇、射擊遊戲，或是做個酷炫的動畫，例如<a href="http://scratch.mit.edu/projects/487159/" target="_blank">「Fire Department」</a>，不管你想做的是什麼，經過一學期的訓練後，我們會有一堂課讓大家討論想法並組隊，之後由助教輔導社員做出作品。</p>
</div>
</div>
</div>
<a href="#ten" class="goto-next scrolly"></a>
</section>
<section id="ten" class="wrapper style2 fade-up">
<div class="8u -2u 10u(medium) -1u(medium)">
<header>
<h2>想了解更多嘛？</h2>
</header>
<div class="row">
<div class="8u 12u(small)">
<p>已經迫不及待想參加我們的社課了嘛？或是你想了解更多資訊？不管你有任何問題，都歡迎你參加我們在 9 月 23 日晚上七點，於台科大 TR 213 教室舉辦的新生茶會，在茶會中我們會針對本學期的規劃做說明。</p>
<p>精采內容，千萬別錯過 <b>程式設計研究社 新生茶會</b></p>
</div>
<div class="4u 12u(small)">
<ul>
<li>茶會日期：9/23（三）</li>
<li>茶會時間：19:30 （19:00 開放入場）</li>
<li>茶會地點：臺灣科技大學 研楊大樓 213 教室（TR-213）</li>
<li>報名網址：<a target="_blank" href="http://ntust-coding-club.kktix.cc/events/welcome-party-2015">http://ntust-coding-club.kktix.cc/events/welcome-party-2015</a></li>
</ul>
</div>
</div>
<div class="row">
<div class="12u"><a target="_blank" href="http://ntust-coding-club.kktix.cc/events/welcome-party-2015" class="button big special">報名新生茶會</a></div>
</div>
</div>
</section>
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-54547687-1', 'auto');
ga('send', 'pageview');
</script>
</body>
</html>