-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
240 lines (128 loc) · 8.55 KB
/
index.html
File metadata and controls
240 lines (128 loc) · 8.55 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
<!DOCTYPE html>
<!--[if IEMobile 7 ]><html class="no-js iem7"><![endif]-->
<!--[if lt IE 9]><html class="no-js lte-ie8"><![endif]-->
<!--[if (gt IE 8)|(gt IEMobile 7)|!(IEMobile)|!(IE)]><!--><html class="no-js" lang="en"><!--<![endif]-->
<head>
<meta charset="utf-8">
<title>MIT Global Startup Labs @ UP Diliman</title>
<meta name="author" content="efcplaza">
<meta name="description" content="Technical Goal Today’s exercise will give you additional practice with basic web design and development, particularly using Coffeescript, …">
<!-- http://t.co/dKP3o1e -->
<meta name="HandheldFriendly" content="True">
<meta name="MobileOptimized" content="320">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="canonical" href="http://up-mit-gsl.github.io">
<link href="/favicon.png" rel="icon">
<link href="/stylesheets/screen.css" media="screen, projection" rel="stylesheet" type="text/css">
<link href="/atom.xml" rel="alternate" title="MIT Global Startup Labs @ UP Diliman" type="application/atom+xml">
<script src="/javascripts/modernizr-2.0.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>!window.jQuery && document.write(unescape('%3Cscript src="./javascripts/lib/jquery.min.js"%3E%3C/script%3E'))</script>
<script src="/javascripts/octopress.js" type="text/javascript"></script>
<!--Fonts from Google"s Web font directory at http://google.com/webfonts -->
<link href="http://fonts.googleapis.com/css?family=PT+Serif:regular,italic,bold,bolditalic" rel="stylesheet" type="text/css">
<link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Fjalla+One' rel='stylesheet' type='text/css'>
</head>
<body class="collapse-sidebar sidebar-footer" >
<header role="banner"><hgroup>
<h1><a href="/">MIT Global Startup Labs @ UP Diliman</a></h1>
<h2>University of the Philippines, Diliman, Quezon City</h2>
</hgroup>
</header>
<nav role="navigation"><ul class="subscription" data-subscription="rss">
<li><a href="/atom.xml" rel="subscribe-rss" title="subscribe via RSS">RSS</a></li>
</ul>
<ul class="main-navigation">
<li><a href="/">Home</a></li>
<li><a href="/materials">Materials</a></li>
<li><a href="/blog/archives">Archives</a></li>
<li><a href="/about-us">About Us</a></li>
<li><a href="/sponsors">Sponsors</a></li>
<li><a href="https://www.facebook.com/groups/374685679298738/">Facebook Group</a></li>
<li><a href="https://plus.google.com/u/0/communities/115612521128637789416">G+ Community</a></li>
</ul>
</nav>
<div id="main">
<div id="content">
<div class="blog-index">
<article>
<header>
<h1 class="entry-title"><a href="/blog/2013/06/22/exercise-crowdfunding-your-own-little-kickstarter/">[Exercise] Crowdfunding: Your Own Little Kickstarter</a></h1>
<p class="meta">
<time datetime="2013-06-22T07:39:00+08:00" pubdate data-updated="true">Jun 22<span>nd</span>, 2013</time>
</p>
</header>
<div class="entry-content"><h4>Technical Goal</h4>
<p>Today’s exercise will give you additional practice with basic web design and development, particularly using Coffeescript, Stylus, and Jade. You will develop a single-page web application for crowdfunding your idea. It’s like Kickstarter, but solely for your startup idea. For the purposes of this exercise, you will not need to power your web application with a back-end, i.e. data does not have to be persistent. You will only focus on developing an interactive front-end using the technologies we talked about so far in class.</p>
<p>In addition, this exercise will provide you with an opportunity to better write your idea to gather supporters as well as raise funds. You don’t need to use the startup idea you have in class (although you certainly can) to complete this exercise.</p>
<p><strong>NOTE:</strong> This exercise is highly open ended. Your mileage will vary depending upon your creativity.</p>
<h4>Details</h4>
<p>Using Jade (HTML), Stylus (CSS), and Coffeescript (Javascript), create a crowdfunder site to raise funds about a particular idea of yours. The following are the requirements for this exercise. However, feel free to go beyond the basic specifications.</p>
<ul>
<li><p>Your web page should contain the following:</p>
<ul>
<li>Name of your project/idea</li>
<li>Short description of idea (in <= five words)</li>
<li>Your name and contact information</li>
<li>Details about your project (breakdown in different sections as you see fit)</li>
</ul>
</li>
<li><p>Your web application should allow users to add donation, i.e. accept money, Bitcoin, or the like. For the purposes of this exercise, you can simply have a textbox that accepts numbers. Use JS to handle input and prompts. Please handle the integrity of the input accordingly, i.e. no negative or zero donations, etc.</p></li>
<li><p>Donations should be tied into a specific donor. Hence, you should also require name input for each donations and display them accordingly. That is, if Bob donates $10, then somewhere in your page should display ‘Bob – $10’ or something like that, and other donations should go along like that as well.</p></li>
<li><p>Your web application should also display donation statistics, i.e. how much donations raised so far, how many more to go ‘til goal is reached, or how many people donated specific ranges of donations. You may add other stats as you think appropriate or necessary.</p></li>
<li><p>Add a comment system to your web application. That is, allow users to comment on your idea. You can choose to display comments by grouping or all at once, but please make sure to sort them in a specific ordering.</p></li>
<li><p>Add a support button to your website. Users should be able to click a link or item to support your project and you should display updated number of supports in your page.</p></li>
</ul>
<p><strong>NOTE:</strong> Your data does not need to be persistent. That is, if someone reloads the page, it is OK to lose all inputted data. However, while the page is active, your application should display information accordingly.</p>
<p><strong>ANOTHER NOTE:</strong> UI is important to attract donors! So prettify your stuff as much as possible. More than just the technology stack you’re using, creativity is also key here. We haven’t talked about UI/UX yet, but please be creative as much as possible.</p>
</div>
</article>
<article>
<header>
<h1 class="entry-title"><a href="/blog/2013/06/16/web-slash-it-homework-1-due-june-22/">Web/IT Homework 1 (Due: June 22)</a></h1>
<p class="meta">
<time datetime="2013-06-16T11:41:00+08:00" pubdate data-updated="true">Jun 16<span>th</span>, 2013</time>
</p>
</header>
<div class="entry-content"><ul>
<li><strong>Date issued:</strong> June 15, 2013</li>
<li><strong>Date due:</strong> June 22, 2013</li>
</ul>
<p>Get setup with angular-momentum in your local machine. Clone the repository at <a href="https://github.com/UP-MIT-GSL/angular-momentum">https://github.com/UP-MIT-GSL/angular-momentum</a> and follow the instructions as provided by the README. You are expected to have angular-momentum setup by the time we meet during the next meeting, on June 22.</p>
</div>
</article>
<div class="pagination">
<a href="/blog/archives">Previous Posts</a>
</div>
</div>
<aside class="sidebar">
<section>
<h1>Recent Posts</h1>
<ul id="recent_posts">
<li class="post">
<a href="/blog/2013/06/22/exercise-crowdfunding-your-own-little-kickstarter/">[Exercise] Crowdfunding: Your own little Kickstarter</a>
</li>
<li class="post">
<a href="/blog/2013/06/16/web-slash-it-homework-1-due-june-22/">Web/IT Homework 1 (Due: June 22)</a>
</li>
</ul>
</section>
</aside>
</div>
</div>
<footer role="contentinfo"><p>
Copyright © 2013 <a href="http://web.mit.edu/misti/">MIT International Science and Technology Initiative</a> - Site by efcplaza
</p>
</footer>
<script type="text/javascript">
(function(){
var twitterWidgets = document.createElement('script');
twitterWidgets.type = 'text/javascript';
twitterWidgets.async = true;
twitterWidgets.src = 'http://platform.twitter.com/widgets.js';
document.getElementsByTagName('head')[0].appendChild(twitterWidgets);
})();
</script>
</body>
</html>