Ruby学习笔记4： 动态web app的建立 We will first build the Categories page. This page contains topics like Art, Home & Living, and Kids, so our users can browse through categories and find what they like. Each Category in our site will need to store information about itself, such as a name and an image. Our Category Model is what stores information about our Categories. Remember that our Model manages the data in our app. =============================== 1. Build Model 2. Build Migration Table

1. Rendering Rendering 是特别要告诉Controller 中的methods，要哪个view file来显示给用户。We can show Views as we wish! Earlier each one of our Views rendered based on the method specified in the Controller. If we write the following method: def render_demo end Rails will always look for the render_demo View. But if we write: def render_demo render :home end We can tell Rails to render the home View, as long as we have one. Rendering just tells Rails to show the View we specify. 这里这个例子是这样的：

社交产品是对每个个体自身人性的迎合、利诱和放大。如果说世界上最复杂的是人性，那么创业项目里最复杂的自然就是社交产品。互联网创业最有意思又最深奥的就是社交类产品。 一款好的社交产品一定是能够迎合人类七宗罪中的其中之一的，比如他觉得Facebook迎合的是傲慢/自负，人们把一些精挑细选的东西用粉饰后的方式表现给他们的关注者们，以此来获得一种虚荣感。 人类七宗罪（好色、暴食、贪婪、懒惰、愤怒、嫉妒、傲慢） 从七宗罪类型的人类原始需求出发的产品，好处是能够迅速吸引用户，形成病毒传播，但坏处是可持续性差，社区氛围维持难度高，和留存低。 更重要的是要像放风筝一样，利用七宗罪反过来的把社区向正面塑造。日常生活中的交往是一样的，哪怕你再喜欢一个人，也是要一步步循序渐进。 懂得生活的人，会从身边的旁枝末节中体会生活，而不是每天只高谈阔论。懂得追女孩子的人，与其每天都在献殷勤、表白和宣誓，不如找点事情一起做，找个共同话题一起聊天。容易交朋友的人，也是一样，都是有自己的兴趣和专长，这样大家才有话聊，才能在交谈中更加深入的了解彼此。 所有社交产品表面上要解决的核心问题只有一个，那就是牵线搭桥、制造媒介，最终让用户基于这个平台上的媒介形成更好的互动和关系的留存。 “知乎”给人们制造的媒介是问答 “YY”或“9158”给人们制造的媒介是视频娱乐内容 “豆瓣”给人们制造的媒介是影音书 “Nice”是潮流文化和标签式媒介 “陌陌”最早兴起的媒介其实就是地理位置因素 “会会”的媒介是用户的行业和背景与相约聊天的主题。 交往的过程需要这些媒介，要让用户之间有话聊，有源源不断的内容产生，内容消费，并且形成关系链条。 有甚者，有一些社交产品跳过了媒介，直接把人和人的关系引向了结果，比如直接可供任何人线下约饭的产品或是单纯根据照片挑选配对类的产品我都觉得是非常粗暴、违反人类正常交往习惯和不可持续的。 社交类产品还有一个需要注意的事情是“媒介的即时性”。 每种媒介的作用和效果都不同。媒介的选择非常重要，直接影响了最终产品和社区的形态。一种双向多边的，每个人都能低成本生产和消费内容的媒介才是最理想的。 垂直社交产品的意义并没有那么大。结果就是社交产品往往是几年出一个大的，也是个赢家通吃的市场。所以在最开始的时候就要想好抓的是用户的什么痛点和原始需求，又该用怎样的媒介来引导。 脉脉、会会、知乎、Linkedin、“Same”、“陪我”、“抱抱”

Ruby on Rails website 的基础是 请求-返回 循环。 首先是浏览器请求服务器， 第二步，Second, in our Rails application, the route takes the request and finds the right Controller and method to handle the request. 第三步，控制器拿到相关数据并发给View模块。 最后，View模块把数据打包好，并且发回给浏览器显示。 ----- 搭建开发环境： Creat rails file package: rails new my-appInstall Ruby gemsMaking a controller called pages 在routes.rb文件中，Create a routeCreate the View 1. Creat rails file package 操作 Rails 用的commands叫做Generator， 在Terminal里，使用如下命令可以新建一个rails app: rails new my-app rails就会建立一系列的站点文件。 然后我们在浏览器里输入：localhost:8000就能访问rails建立的第一个web 站点：   Let's learn about the files that you generated.来看看我们建立了哪些文件：   Rails is made up folders that hold our code:

Pictures Patrick Hughes (artist) From Wikipedia, the free encyclopedia Patrick Hughes. Leaning on a Landscape, 1979, print. Patrick Hughes (born 20 Oct 1939)[1] is a British artist working in London. He is the creator of "reverspective", an optical illusion on a 3-dimensional surface where the parts of the picture which seem farthest away are actually physically the nearest. Contents   [hide]  1 Life2 Art3 Writing4 Influences5 Bibliography6 References7 External links Life[edit] Patrick Hughes was born in Birmingham, went to school in Hull and went on at the James Graham Day College in Leeds in 1959. Later he taught at the Leeds College of Artbefore becoming an independent artist.

Ruby 有4种数据类型：String, Boolen, Array, Hashes Ruby 有3种操作方法：Method, attribute, ?? Ruby 有xxx: Classes, Object.... ====先来看数据类型==== 1. String and Declaring the variables:  name = "Wonder Woman" #declare a var and store a string puts name <span style="white-space:pre"> </span>#puts -- print out the var sum = 5 + 1.4 puts sum correct = 1 == 1 puts correct 2. Arrays: cities = ["chongqing","beijing","shanghai"] puts cities[1]; #print out the SECOND city 3.Hashes: 注意这句话：We can access any value by naming its key seasons = { "Spring" => 20, "Summer"=>30, "Autumn"=>20, "Winter"=>02} puts seasons["Winter"] #{ ?

开始之前：http://docs.jquery.com/ 是jQuery文档的网站， https://jsfiddle.net/是js的在线验证工具 在html中，有这几个标签：  javascript、jQuery代码：var main = function(){ $('.dropdown-toggle').click(function(){ //$('.dropdown-menu').slideDown(); $('.dropdown-menu').toggle(); }); // Click Slides -- Show next slide $(&#39;.arrow-next&#39;).click(function(){//select var currentSlide = $(&#39;.active-slide&#39;); var nextSlide = currentSlide.next(); if (nextSlide.length ===0) nextSlide = $(&#39;.slide&#39;).first(); currentSlide.fadeOut(600); nextSlide.fadeIn(600); currentSlide.removeClass(&#39;active-slide&#39;);//注意这里没有&quot;.&quot; nextSlide.addClass(&#39;active-slide&#39;); //让点点的颜色跟随变化 var currentDot = $(&#39;.active-dot&#39;); var nextDot = currentDot.next(); if (nextDot.length === 0) nextDot = $(&#39;.dot&#39;).first(); currentDot.removeClass(&#39;active-dot&#39;); nextDot.addClass(&#39;active-dot&#39;); }); // Click Slides -- show previous slide $(&#39;.arrow-prev&#39;).click(function(){//select var currentSlide = $(&#39;.active-slide&#39;); var prevSlide = currentSlide.prev(); if (prevSlide.length === 0) prevSlide = $(&#39;.slide&#39;).last(); currentSlide.

jQuery学习笔记4——A flipboard 剪贴板实例 开始之前：jQuery文档(http://docs.jquery.com/) ， js在线IDE(https://jsfiddle.net/)，教程：(http://w3school.com.cn/) slideDown ——下滑 slideUp —— 向上滑 fadeIn —— 淡入 fadeOut —— 淡出 animate ——动画 takes two parameters: 1. A set of CSS properties, 2. A time duration over which to change them. 1. //*********关于slideDown和slideUp热身小程序********// 2. //=========点击从上往下出现========== 3. var main = function() { 4. $(".btn").click(function(event) { 5. $(".container").hide(); 6. $(".container").slideDown(900); 7. }); 8. }; 9. 10. $(document).ready(main); 11. 12. //=========点击从下往上出现========== 13. 14. var main = function() { 15. $(".btn").click(function(event) { 16. $(".container").show (); 17. $(".container").slideUp(1100); 18. }); 19.

产品经理从零到一技术进阶：不懂代码也能愉快地与开发相处 产品经理从零到一技术进阶：不懂代码也能愉快地与开发相处 原文链接： http://mp.weixin.qq.com/s?__biz=MjAzNzMzNTkyMQ==&mid=205836688&idx=1&sn=e7f7131702c907cc22cf2f5e8474595d&scene=2#rd 原创 2015-04-14 馨苑 36氪 36氪 36氪 微信号 wow36kr 功能介绍 36氪(36Kr.com)是中国领先的科技新媒体，我们报道最新的互联网科技新闻以及最有潜力的互联网创业企业。 36氪微信号：wow36kr 这是 NEXT 「产品经理从零到一技术进阶：不懂代码也能愉快地与开发相处」线下活动的笔记。主讲者张元一，产品原型工具墨刀的创始人，见证了 Web 开发从 99 年 HTML4.0 到去年 12 月 HTML5 最终定稿这之间整个 Web 开发变迁史的 15 年「码龄」全栈工程师。 NEXT 本次活动收到了近 1000 多个报名，大家对周日线上和线下的互动学习反馈也不错。因此我们将笔记分享出来，希望让更多产品人、创业者够快速了解基本技术知识，更好地把握产品周期与项目进度。当然，你也可以观看网聚直播提供的视频回放：http://wangju.tv/live/3k562amaskvzg 。 概览 以下这张图就是元一分享的干货内容，它基本涵盖了一个初级码农需要知道的所有基础入门知识。但这张图的目的并非用来吓人，这其中的所有技术名词，将以最通俗易懂的方式串联起来—— 即我们上网时的慢动作解析：打开一个网页或 App，这背后都运用了那些技术来让这个网页和 App 的内容呈现在浏览器和手机上；驱动这些动作背后的技术名词都是什么，各自有着怎样的优缺点，彼此间是如何协作和运转的，以及怎样合理地评估技术能力和开发难度。当然，元一也推荐了丰富的学习资料。 这中间涉及的技术知识，前端包括 HTML，CSS，JavaScript，jQuery 以及 Bootstrap ；后端包括 HTTP 服务器，后端编程语言，数据库以及 Cookie 和 Session；移动开发分为原生，混合式，HTML5，以及不同的移动端技术选择在功能和开发成本上的比较。 什么是前端？什么是后端？二者是如何配合运转的？ 前后端的划分，可以简单地理解为凡是运行在用户设备上的技术都可以称为前端技术（ 比如 HTML / CSS / JS，甚至移动设备的 Obj-C / Swift ）；而后端的作用就是负责将这些东西封装在 HTTP 的数据包中然后通过网络传送到前端。当然除了这些前端文件，后端还有一个更重要的职能，即保存和提供用户数据，比如移动端常见的 JSON 就是目前最流行的在后端和前端之间传输的一个文件格式。 前端与后端是如何配合的？如上图，以 Web 端为例，在浏览器输入一个网址后，浏览器向服务器发送了一个 HTTP 请求；服务器通过一个 HTTP 响应，把显示这个网页所需要的资源传回给了浏览器。而需要在浏览器中执行的技术，HTML / CSS / Javascript 等就叫做前端；需要在服务器端执行的、通常我们看不到技术就叫做后端。

jQuery学习笔记3——写的状态板简单实例 http://jsfiddle.net & jQuery.com & tutorial: http://w3school.com.cn/ , http://www.codecademy.com/ Congratulations! You used jQuery events to build a status update tool. You can type messages and post status updates A counter keeps track of the number of characters left The Post button is only enabled when there is a message that is 140 characters or less Great work! Next let’s learn more about how to use jQuery to create animated transitions. HTML: 1. <!doctype html> 2. <html> 3. <head> 4. <link href="http://s3.