tag:blogger.com,1999:blog-75454587397440226072024-02-20T01:21:56.879-05:00Web 2.0: Building Rich Internet ApplicationsThis CMU stuco course is going to go over the basics of Web 2.0. We will go over the social impact of this trend and cover the technologies behind the scenes. We will cover HTML, CSS, JavaScript, DHTML, AJAX, JavaScript Libraries, Adobe Flex, Ruby on Rails, and perhaps a few other things.Ryanhttp://www.blogger.com/profile/03770870265023271903noreply@blogger.comBlogger18125tag:blogger.com,1999:blog-7545458739744022607.post-90906432300013832642007-04-28T16:14:00.000-05:002007-04-28T16:21:12.712-05:00Flex Lecture and Yahoo! WikisearchHere's what we've covered over the last 3 weeks.<br /><br /><span style="font-weight: bold;"><a href="http://www.andrew.cmu.edu/user/sivas/website/lectures/presentation11.ppt">Flex Lecture PPT</a></span><br /><br /><span style="font-weight: bold;"><a href="http://kentbrewster.com/wiki-search-widget">Yahoo! Wiki-search Widget</a></span><br /><br /><br />The flex code we did in class:<br /><br /><a href="http://www.andrew.cmu.edu/user/sivas/website/lectures/googleEmployees.zip">Google Employees Example (UI Components and XML data)</a><br /><a href="http://www.andrew.cmu.edu/user/sivas/website/lectures/urbanDictionary.zip">Dealing with external service</a><br /><a href="http://www.andrew.cmu.edu/user/sivas/website/lectures/link5.zip">Mashup Paul and I made...code isn't so clean</a><br /><br />To get started in Flex, I would reccomend using Flex Builder. You can get all the info here: <a href="https://www.adobe.com/cfusion/tdrc/index.cfm?product=flex">Download Flex SDK, Builder, etc...</a>. There's also some good tutorials here: <a href="http://www.adobe.com/devnet/flex/">Getting started with Flex</a><br /><br />One cool website we showed you guys was <a href="http://www.programmableweb.com/">ProgrammableWeb</a> which lists API's and cool mashups that others have done.<br /><br />If you want to know some good JavScript or Flex online resources and/or books, let me know, and I'll post some stuff I use.Ryanhttp://www.blogger.com/profile/03770870265023271903noreply@blogger.com0tag:blogger.com,1999:blog-7545458739744022607.post-43174315760033477392007-04-10T12:19:00.000-05:002007-04-10T12:36:41.675-05:00Javascript Libraries Part 2Sorry I didn't post this earlier but here it is. This is the second half of the lecture on Javascript libraries.<br /><br /><span style="font-weight: bold;"><a href="http://www.andrew.cmu.edu/user/sivas/website/lectures/presentation09.ppt">Lecture PPT</a></span><br /><br /><br />The libraries we covered today were:<br /><br /><a href="http://dojotoolkit.org/">Dojo</a><br /><a href="http://www.openlaszlo.org/">Open Laszlo</a><br /><a href="http://code.google.com/webtoolkit/">Google Web Toolkit</a><br /><br />The second two have extensive examples so I only did an example for Dojo:<br /><br /><a href="http://www.andrew.cmu.edu/user/sivas/website/lectures/examples/dojo/fisheye.html">Dojo Fisheye</a>sivahttp://www.blogger.com/profile/04462931189295118286noreply@blogger.com1tag:blogger.com,1999:blog-7545458739744022607.post-48205321174485899162007-04-10T11:39:00.000-05:002007-04-10T11:42:53.504-05:00Next few classes4/11: This week, we're going to move into Flex.<br /><br />4/18: Despite the fact that next week is right before carnival starts, we are still having class, and because we have a guest lecturer from Yahoo, we are counting next weeks class as 2 classes and hoping everyone comes. Also bring laptops so you can follow along.<br /><br />4/25: After that, we'll move back into Flex.<br /><br />5/2: Then, our last class, will be a wrap-up (we might also brush over security), where we present some of the projects that have been completed and announce the winner. We'll also have a pizza party for the class this day.Ryanhttp://www.blogger.com/profile/03770870265023271903noreply@blogger.com0tag:blogger.com,1999:blog-7545458739744022607.post-47911541524119893182007-03-28T19:52:00.000-05:002007-04-02T15:05:53.412-05:00Project InformationHere is the information about the project that we covered in class today. The deadline for the project will be near the end of the semester. The deadline for the proposal is next Thursday April 5, 2007:<br /><br />1. Team members' names<br />2. Short description of the project (couple of sentences)<br />3. Technologies used (HTML, CSS, etc.)<br />4. Why is it relevant? Why is it Web 2.0?<br /><br />Deadline for proposal: <span style="font-weight: bold;">April 5, 2007</span><br /><br />Send an email to <a href="mailto:frish@cmu.edu">frish@cmu.edu</a> and <a href="mailto:siva@cmu.edu">siva@cmu.edu</a>.sivahttp://www.blogger.com/profile/04462931189295118286noreply@blogger.com0tag:blogger.com,1999:blog-7545458739744022607.post-50707499220626248212007-03-28T19:47:00.000-05:002007-03-28T20:13:35.954-05:00Javascript Libraries Part 1Here is this information about the JavaScript libraries. I won't post the lecture yet because we have only done the first part, but its not that complicated.<br /><br />Libraries covered today:<br /><br /><a href="http://developer.yahoo.com/yui/">Yahoo UI</a><br /><a href="http://www.prototypejs.org/">Prototype</a><br /><a href="http://script.aculo.us/">Script.aculo.us</a><br /><br />I have also uploaded the examples files we covered in class today. They should work but let me know if they don't.<br /><br /><a href="http://www.andrew.cmu.edu/user/sivas/website/lectures/examples/autocomplete/autocomplete.html">Old Autocomplete</a>, <a href="http://www.andrew.cmu.edu/user/sivas/website/lectures/examples/autocomplete/data.html">Corresponding Data File</a><br /><a href="http://www.andrew.cmu.edu/user/sivas/website/lectures/examples/yui/autocomplete.html">YUI Autocomplete</a><br /><a href="http://www.andrew.cmu.edu/user/sivas/website/lectures/examples/yui/menu.html">YUI Menu</a><br /><a href="http://www.andrew.cmu.edu/user/sivas/website/lectures/examples/prototype/demo.html">Prototype Examples</a><br /><a href="http://www.andrew.cmu.edu/user/sivas/website/lectures/examples/prototype/dragdrop.html">Script.aculous.us Drag/Drop</a><br /><span style="font-weight: bold;"><a href="http://www.andrew.cmu.edu/user/sivas/website/lectures/presentation05.ppt"></a></span><a href="http://www.andrew.cmu.edu/user/sivas/website/lectures/drag_n_drop.html"><br /></a>sivahttp://www.blogger.com/profile/04462931189295118286noreply@blogger.comtag:blogger.com,1999:blog-7545458739744022607.post-12425218578820270832007-03-21T19:30:00.000-05:002007-03-21T19:35:53.896-05:00Lecture 6,7,8: JavaScriptBeen a while since we posted. This lecture covers a lot, from basic JavaScript to DOM to dHTML to Advanced JavaScript with prototype-inheritance and function closures and finally to AJAX.<br /><br /><span style="font-weight: bold;"><a href="http://www.andrew.cmu.edu/user/sivas/website/lectures/presentation05.ppt">Lecture PPT</a></span><br /><br />We also went over some examples. I've posted those here:<br /><br /><a href="http://www.andrew.cmu.edu/user/sivas/website/lectures/row_hilighter.html">Table Row Highlighter</a><br /><a href="http://www.andrew.cmu.edu/user/sivas/website/lectures/move_el.html">Move Element</a><br /><a href="http://www.andrew.cmu.edu/user/sivas/website/lectures/drag_n_drop.html">Drag'n Drop</a>Ryanhttp://www.blogger.com/profile/03770870265023271903noreply@blogger.com0tag:blogger.com,1999:blog-7545458739744022607.post-62203387641974761072007-02-25T23:33:00.000-05:002007-02-25T23:39:16.145-05:00Lecture 4/5: Ruby on RailsHere's lecture 4/5 on Ruby on Rails<br /><br /><span style="font-weight: bold;">Lecture 4/5 (<a href="http://www.andrew.cmu.edu/user/sivas/website/lectures/presentation04.ppt">PPT</a> | <a href="http://www.andrew.cmu.edu/user/sivas/website/lectures/presentation04-code.zip">Code</a>)</span><br /><br />Sorry if the code example was a little boring, but important points to take away are that Ruby is a really cool language, and Rails is a great framework that makes a lot of the typical stuff (form abstract, no SQL, database relationships, etc...) much simpler.<br /><br />Websites mentioned were:<br /><ul><li><a href="http://www.youtube.com/watch?v=6gmP4nk0EOE">Web 2.0 Video</a></li><li><a href="http://www.sitepoint.com/videos/videoinstallrails1/">Video for installing Ruby on Rails</a></li><li><a href="http://www.digitalmediaminute.com/article/1816/top-ruby-on-rails-tutorials">Top 12 Ruby on Rails Tutorials</a></li><li><a href="http://www.rubycentral.com/book/index.html">Great Free Book on Ruby</a></li></ul>As we start covering JavaScript and DHTML, I recommend you guys fool around creating a basic website and manipulating some CSS styles.Ryanhttp://www.blogger.com/profile/03770870265023271903noreply@blogger.com2tag:blogger.com,1999:blog-7545458739744022607.post-2880313260257232032007-02-21T00:19:00.000-05:002007-02-21T00:20:34.695-05:00Hurray...Class tomorrowSo we're back on schedule. There's class tomorrow (in PH A18A). There's a cool video and website I want to show you guys, and we'll finish up Ruby on Rails with our example joke website.Ryanhttp://www.blogger.com/profile/03770870265023271903noreply@blogger.com0tag:blogger.com,1999:blog-7545458739744022607.post-20062785649750759762007-02-14T16:25:00.000-05:002007-02-14T16:26:28.187-05:00Adobe Flex InternshipMy future boss at Adobe wants to start recruiting at CMU (as do I). We'll definitely be back next year with more of a plan, but if you would like to intern at Adobe, specifically the Flex team, let me know and shoot me an email with your resume.Ryanhttp://www.blogger.com/profile/03770870265023271903noreply@blogger.com0tag:blogger.com,1999:blog-7545458739744022607.post-91559095540471461932007-02-14T16:21:00.000-05:002007-02-14T16:55:45.425-05:00No class todayBecause of the weather and some laziness, we've decided to delay Rails part II and cancel class today.Ryanhttp://www.blogger.com/profile/03770870265023271903noreply@blogger.com1tag:blogger.com,1999:blog-7545458739744022607.post-4675602496588997172007-02-02T11:40:00.000-05:002007-02-02T11:41:51.926-05:00Class in PH A18Just as a reminder, the next class on 2/7/2007 will be in PH A18 and will be on Ruby on RailsRyanhttp://www.blogger.com/profile/03770870265023271903noreply@blogger.com0tag:blogger.com,1999:blog-7545458739744022607.post-30800072401668206002007-02-02T10:44:00.000-05:002007-02-02T11:53:47.884-05:00Lecture 3 ResourcesHere are some resources relating to the CSS lecture.<br /><br /><span style="font-style: italic;">Some References:<br /><br /></span>These links have information regarding CSS and how to use it.<br /><br /><ul><li><a href="http://www.westciv.com/style_master/academy/css_tutorial/index.html">http://www.westciv.com/style_master/academy/css_tutorial/index.html</a> was the tutorial I used as reference to develop the lecture<br /></li><li><a href="http://www.webcredible.co.uk/user-friendly-resources/css/">http://www.webcredible.co.uk/user-friendly-resources/css/</a> some articles<br /></li><li>The <a href="https://addons.mozilla.org/firefox/1806/">DOM Inspector</a> and <a href="https://addons.mozilla.org/firefox/1843/">Firebug</a> from last time are great for viewing the CSS as you are browsing the net.<br /></li><li><a href="http://www.sitepoint.com/subcat/css">http://www.sitepoint.com/subcat/css</a> is the sitepoint tutorial and reference point. sitepoint is a great site for many things web-related.<br /></li></ul><br /><span style="font-style: italic;">CSS Standards:<br /><br /></span>As with HTML, the CSS standards are not always adhered to. This allows for many "hacks" to get around browser compatibility. These are some links that explain what will work and where.<br /><br /><ul><li><a href="http://www.webdevout.net/browser_support_css.php">http://www.webdevout.net/browser_support_css.php</a> shows which properties and selectors and such are supported by a few more recent browsers<br /></li><li><a href="http://www.quirksmode.org/css/quirksmode.html">http://www.quirksmode.org/css/quirksmode.html</a> is a site that explains how your browser handles CSS in "quirks" mode</li><li><a href="http://centricle.com/ref/css/filters/">http://centricle.com/ref/css/filters/</a> lists some possible CSS hacks (that you really shouldn't be using) and where these hacks will work.<br /></li></ul>sivahttp://www.blogger.com/profile/04462931189295118286noreply@blogger.com0tag:blogger.com,1999:blog-7545458739744022607.post-70257846756627209592007-02-02T10:37:00.000-05:002007-02-02T11:40:13.343-05:00Lecture 3This is Lecture 3, which is the lecture on CSS. It basically lists a bunch of different property values, but if you weren't in class then you probably didn't hear me go over the important ones. There will be some resources posted that has a link to a CSS reference page, that you can go to if you want to know what a specific property does.<br /><br /><span style="font-weight: bold;">Lecture 3 (<a href="http://www.andrew.cmu.edu/user/sivas/website/lectures/presentation03.ppt">PPT</a>)</span><br /><br />We also played some Jeopardy and here is the powerpoint for that as well.<br /><br /><span style="font-weight: bold;">Jeopardy (<a href="http://www.andrew.cmu.edu/user/sivas/website/lectures/web20_jeopardy.ppt">PPT</a>)</span>sivahttp://www.blogger.com/profile/04462931189295118286noreply@blogger.com0tag:blogger.com,1999:blog-7545458739744022607.post-23672475162164458842007-01-31T10:14:00.000-05:002007-01-31T10:22:11.731-05:00Good BlogsHere's a really good blog post by Bruce Eckel (famous for writing Thinking in C/Thinking in Java series) talking about how the web environment is different (and perhaps a biased view of Adobe Flex): <a href="http://www.artima.com/weblogs/viewpost.jsp?thread=193593">http://www.artima.com/weblogs/viewpost.jsp?thread=193593</a><br /><br />Some blogs that are updated quite frequently that I read are:<br /><a href="http://www.readwriteweb.com/"><br />http://www.readwriteweb.com/</a> - ReadWriteWeb often times has some really insightful comments about the new web<br /><br /><a href="http://blogs.zdnet.com/Stewart/">http://blogs.zdnet.com/Stewart/</a> - Ryan Stewart talks about Rich Internet Applications and technologies emerging out of it. He's a little biased and doesn't believe in the AJAX as an Rich Internet Application tool<br /><br /><a href="http://www.techcrunch.com/">http://www.techcrunch.com/</a> - TechCrunch keeps up-to date with news items about companies forming or new products coming out. It's usually not too insightful but still very good to keep up with<br /><br />Hopefully at some point, I'll post a list of all the blogs I read, but this will be good start for now. I really recommend getting an RSS read and subscribing to these places (you can even subscribe to this blog!).<br /><br />If you have some good blogs or news sites, post it in the comments.<br /><br />-RyanRyanhttp://www.blogger.com/profile/03770870265023271903noreply@blogger.com0tag:blogger.com,1999:blog-7545458739744022607.post-53115403497928882642007-01-26T16:09:00.000-05:002007-01-26T16:15:24.542-05:00Updates as of 1/26I let people in off the waitlist who've been coming to class. If you're still on the waitlist and want to get into the course, please let me know. Also, if you are not planning on attending class, please drop it, so we can have a better idea of how many people we can expect and let others off the waitlist who want to get in.<br /><br />Next week we are planning on covering CSS (Cascading Style Sheets).<br /><br /><span style="font-size:130%;"><span style="font-weight: bold;">Please note that we will be in DH1112 again this Wednesday 1/31 6:30-7:50 (this will be the last time).</span></span>Ryanhttp://www.blogger.com/profile/03770870265023271903noreply@blogger.com0tag:blogger.com,1999:blog-7545458739744022607.post-11412975831552243832007-01-26T15:13:00.000-05:002007-01-26T20:55:01.918-05:00Lecture 2Here's lecture 2. Topics covered were HTML (yes, a little boring) and HTTP Requests.<br /><br /><span style="font-weight: bold;">Lecture 2 (<a href="http://www.andrew.cmu.edu/user/sivas/website/lectures/presentation02.ppt">PPT</a>)</span><br /><br />Siva did a really neat demo of how you can just telnet into a webserver and request documents. Just try something, like:<br /><br />telnet www.google.com 80<br />GET / HTTP1.1<br />Host: www.google.com<br /><br />Siva also mentioned a cool firefox extension called firebug (you can get it here: <a href="https://addons.mozilla.org/firefox/1843/">Firebug</a>). The newest version, 1.0, just came out on 1/24/07. To monitor traffic, open up firebug (tools->firebug->open firebug). Then select the net subheader. Now you can monitor traffic on the site you are looking at.<br /><br />Siva also began a demo for the <b>Carnegie Mellon Delivery Service</b> (CMDS), and the current progress for that page is here: <a href="http://www.andrew.cmu.edu/user/sivas/website/cmds.html">CMDS</a>. We will be using this throughout the course and updates will be posted accordingly. To look at the code, right click in the browser and do view source.<br /><br />Good websites for help and further info:<br /><ul><li><a href="http://www.informit.com/articles/article.asp?p=169578&seqNum=1&rl=1">Understand Application Layer Protocols: HyperText Transfer Protocol (HTTP)</a></li><li><a href="http://www.cs.tut.fi/%7Ejkorpela/http.html">Quick reference to HTTP headers</a></li><li><a href="http://www.w3schools.com/tags/default.asp">HTML 4.01/XHTML 1.0 Reference</a></li><li><a href="http://www.w3.org/QA/2002/04/Web-Quality">Info about Doctypes</a></li></ul>Ryanhttp://www.blogger.com/profile/03770870265023271903noreply@blogger.com0tag:blogger.com,1999:blog-7545458739744022607.post-39070847502792512382007-01-26T14:29:00.000-05:002007-01-26T17:30:33.770-05:00Lecture 1 ResourcesHere are some of the resources mentioned in lecture 1 as well as some other useful ones.<br /><br /><span style="font-weight: bold;">Defining Terms:</span><br /><a href="http://www.oreillynet.com/pub/a/oreilly/tim/news/2005/09/30/what-is-web-20.html">What is Web 2.0, Tim O'Reilly</a><br /><a href="http://en.wikipedia.org/wiki/Web_2.0">Wikipedia: Web 2.0</a><br /><a href="http://en.wikipedia.org/wiki/Rich_internet_applications">Wikipedia: Rich Internet Applications</a><br /><br /><span style="font-weight: bold;">Popular/Cool Web 2.0 Sites:</span><br /><a href="http://www.flickr.com/">Flickr</a> - Photo Sharing Website<br /><a href="http://del.icio.us/">del.icio.us</a> - Sharing Bookmarks<br /><a href="http://www.zimbra.com/">Zimbra</a> - Open Source email application/Collaboration Suite<br /><a href="http://www.espgame.org/">The ESP Game</a> - Really fun game, harnessing the collective intelligence of the people. Made by a professor at CMU.<br /><a href="http://www.go2web20.net/">Go2Web20.net</a> - More complete list of Web 2.0 sites<br /><br /><span style="font-weight: bold;">Good Books to Read about the "Revolution":</span><br /><a href="http://www.amazon.com/World-Flat-Updated-Expanded-Twenty-first/dp/0374292795/sr=8-1/qid=1169840182/ref=pd_bbs_sr_1/105-5046664-0321204?ie=UTF8&s=books">The World Is Flat, Thomas Friedman</a><br /><a href="http://www.amazon.com/Long-Tail-Future-Business-Selling/dp/1401302378/sr=1-1/qid=1169840262/ref=pd_bbs_sr_1/105-5046664-0321204?ie=UTF8&s=books">The Long Tail: Why the Future of Business is Selling Less of More, Chris Anderson</a> (abridged <a href="http://www.wired.com/wired/archive/12.10/tail.html">Wired Article</a>)<br /><br /><span style="font-weight: bold;">Some Good Web Development Sites:</span><br /><a href="http://www.sitepoint.com/">SitePoint</a><br /><a href="http://www.devshed.com/">DevShed</a><br /><a href="http://www.w3schools.com/">W3Schools</a><br /><a href="http://www.webmonkey.com/">Webmonkey</a><br /><a href="http://www.pageresource.com/">PageResource</a><br /><a href="http://www.javascriptkit.com/">JavaScript Kit</a>Ryanhttp://www.blogger.com/profile/03770870265023271903noreply@blogger.com0tag:blogger.com,1999:blog-7545458739744022607.post-46192930047084137322007-01-26T12:02:00.000-05:002007-01-26T15:20:51.479-05:00Lecture 1Here's lecture 1. It helps define what the course is and what topics we will go over. It also attempts to define the very ambiguous term, Web 2.0.<br /><br /><span style="font-weight:bold;">Lecture 1 (<a href="http://www.andrew.cmu.edu/user/sivas/website/lectures/presentation01.ppt">PPT</a>)</span>Ryanhttp://www.blogger.com/profile/03770870265023271903noreply@blogger.com0