• 请不要在回答技术问题时复制粘贴 AI 生成的内容
hayeah
V2EX  ›  程序员

[思客教学公开课] - 从 0 到 1 实现响应式个人网站

  •  4
     
  •   hayeah · May 11, 2015 · 11724 views
    This topic created in 4201 days ago, the information mentioned may be changed or developed.

    这是一个免费公开课,报名请发邮件到 [email protected]


    对于很多不擅长前端的程序员来说,写 CSS 是一件很痛苦的事情。虽然你了解了 CSS 的基本原理,真的去实现一个设计却发现其实不是那么简单,毕竟还是 too young。

    CSS 有很多坑。同样的属性在不同的环境,或者使用在不同的元素上,都有可能产生完全不同的效果。 明明设定了间隔,为什么在某些情况却不生效?为什么 float 把我的布局打乱了?为什么 text-align: center 不能居中某个元素?

    很多时候写 CSS 感觉像是在碰运气。浏览器渲染出来不是你要的效果,也不知道为什么,就只能瞎调属性。姿势就对了,浏览器就会给我们正确的效果。

    前端大牛工作的方法不一样。他们不在个别属性的层面思考。看到一个需求,他们能直接匹配一个适用的 “CSS Design Pattern”。用设计模式,他们能更快的实现一个页面,减少浪费在调试的时间。

    在这个 CSS 课程,我们要实现一个响应式个人网站:

    该页面可以在此访问: http://profile-sample.strikingly.com/,

    这个课程和其他教程不一样,我们不提供可以工作的代码。我们会按需求介绍 “CSS 设计模式” 给你认识,而你必须自己去尝试把这些概念应用在一个真正的页面上。请你打开你忠实的编辑器,边看边做!

    本次教学活动由 思客教学 和 Strikingly 联合举办。Strikingly 是第一个 YCombinator 学成回国的创业公司。世界很大,可以 去 Strikingly 看看!

    我们对你的要求:

    • 了解 HTML 和 CSS 基础
    • 能阅读英文文档

    这是一个免费公开课。

    想学前端的小伙伴, 请发邮件报名: [email protected]

    邮件里请你简单地说一下自己前端的经验。

    最后,我们在准备一个前端课程,你会想学什么呢?在帖子里说说~

    Supplement 1  ·  May 12, 2015
    谢谢大家的支持~ 现在报名的人数有点多,我们没把握照顾好各位。所以我们计划分成两个梯次来邀请大家,来保证教学质量。

    第一梯次邀请:明天发邀请(05/13/2015)
    第二梯次邀请:下周五发邀请 (05/20/2015)

    第二梯次持续接受报名 :)
    77 replies  •  2016-06-14 08:30:35 +08:00
    init
    init
    May 11, 2015
    1
    常年后端c++ 能不能学啊。。。。
    franklight
    franklight
    May 11, 2015
    2
    挺好,开始了以后参加
    hayeah
    hayeah
    OP
    May 11, 2015
    3
    @init 可以啊~ 了解 HTML/CSS 基本语法就可以了。概念上还是挺简单的,主要还是应用比较困难
    ericls
    ericls
    May 11, 2015
    4
    你们的工作地点是国内还是国外啊?
    hayeah
    hayeah
    OP
    May 11, 2015
    5
    @franklight 发一下邮件报名呗~
    hayeah
    hayeah
    OP
    May 11, 2015
    6
    @ericls 我们是远程团队。武汉,大理,绵阳。
    ipconfiger
    ipconfiger
    May 11, 2015
    7
    不错,学一学来把自己的blog修缮修缮
    hayeah
    hayeah
    OP
    May 11, 2015
    8
    @ipconfiger 拉上贵厂的前端渣~ 哈哈哈
    zonghua
    zonghua
    May 11, 2015 via iPhone
    9
    还是bootstrap算了,没精力去做前端
    WildCat
    WildCat
    May 11, 2015 via iPhone
    10
    已经申请~
    dfguo
    dfguo
    May 11, 2015❤️1
    11
    Hello,我是 Strikingly 的 CTO,也是团队前端的负责人。课程安排我们也 review 过。这个课程可以教你响应式网页的前端思维和框架。做得比较系统化,非常值得一学。
    mopig
    mopig
    May 11, 2015
    12
    已发邮件...
    sennes
    sennes
    May 11, 2015
    13
    已报名
    其实我们团队想设计个网站用于展示成果的。
    可是团队都是搞软硬件的,只有我有一点点的前端基础。
    我想的是做一个只有一个页面的、简洁一点的网站。
    shoto
    shoto
    May 11, 2015
    14
    已报名。
    虽然能写简单的静态页面,但是对于CSS更深层次理解还是不行。
    terax
    terax
    May 11, 2015 via iPhone
    15
    已报名~
    loddit
    loddit
    May 11, 2015❤️1
    16
    howard 已经做过好几期教学活动啦,居然每次都是不同的领域
    littlewey
    littlewey
    May 11, 2015
    17
    已报名
    VincentZhou
    VincentZhou
    May 11, 2015
    18
    已报名
    Honwhy
    Honwhy
    May 11, 2015
    19
    支持,我想跟读你们提出来的相关链接,related links。
    hakulamatata
    hakulamatata
    May 11, 2015
    20
    光讲前端的话太枯燥了,至少有点功能吧。比如配合表单提交啥的。。。
    zjgsamuel
    zjgsamuel
    May 11, 2015
    21
    已报名 +1
    baozijun
    baozijun
    May 11, 2015
    22
    已报名 ,谢谢!
    iLtc
    iLtc
    May 11, 2015
    23
    过来支持一下我们老大,这个课程的第一期我试做了一下,很好玩的~
    KoleHank
    KoleHank
    May 11, 2015
    24
    已报名,准备去学习一下看看。
    v2014
    v2014
    May 11, 2015
    25
    已报名
    我写的页面总是那么土,希望能去去土
    renzhe
    renzhe
    May 11, 2015
    26
    已报名,虽然会写HTML+CSS,但是不美观,想学习一下怎么设计出美观的网页
    wosuopu
    wosuopu
    May 11, 2015
    27
    已报名
    funky
    funky
    May 11, 2015
    28
    已报名,做web的对前端这块很弱,希望能提高下
    ljcarsenal
    ljcarsenal
    May 11, 2015
    29
    已报名
    Dongdong36
    Dongdong36
    May 11, 2015
    30
    请问是怎样的学习方式
    CodeDrift
    CodeDrift
    May 11, 2015
    31
    学习方式呢?视频?还是?
    stgzr
    stgzr
    May 11, 2015
    32
    土问在时间上怎么安排?一点前端知识都没有可以尝试吗>.<
    charliestras
    charliestras
    May 11, 2015
    33
    已报名,比较好奇课程会以怎样的方式进行
    cloudbeyond
    cloudbeyond
    May 11, 2015
    34
    已报名~很期待分享呀~
    penjianfeng
    penjianfeng
    May 11, 2015
    35
    已报名,同好奇课程时间以及方式
    pythonee
    pythonee
    May 11, 2015
    36
    后端程序员的福利哈
    ywm8812
    ywm8812
    May 11, 2015
    37
    已报名~
    fashioncj
    fashioncj
    May 11, 2015
    38
    报名~
    cvmax
    cvmax
    May 11, 2015
    39
    bootstrap可破
    zld
    zld
    May 11, 2015
    40
    老大我又来报名啦:D
    ghosrt
    ghosrt
    May 11, 2015
    41
    已发邮件报名。
    young7657
    young7657
    May 11, 2015
    42
    已经报名
    hayeah
    hayeah
    OP
    May 11, 2015
    43
    @Anybfans 没有视频。自己动手操作
    hayeah
    hayeah
    OP
    May 11, 2015
    44
    @zld 欢迎回来 :)
    WildCat
    WildCat
    May 11, 2015
    45
    @hayeah 这个课程多久开始呀?持续几期(几周)?

    关于前端,自己的一点想法(非常不专业):
    1. 尽量不要教 Angular
    2. React 挺新,不知道合适不合适,如果能选择其他的框架也很欢迎,比如 Ember/Backbone
    3. gulp/grunt 的花式玩法是否可以涉及一些?
    4. 一些通用库对于自己 App 的封装思路是否可以介绍下? 比如 superagent ,怎么为自己 App 封装一下比较合适?
    5. 如果能涉及把 Origami 的原型转换为 JavaScript 动画就更赞了(主要期待 Sketch 课程的原型设计能填满坑。。。)
    hayeah
    hayeah
    OP
    May 11, 2015
    46
    @WildCat 这个只是一个试验课程而已,看看前端要以什么形式来教。

    1. 我个人看好 React,看衰 Angular。
    1. 我超讨厌 gulp & grunt, 完全不可忍。用 make 或者 webpack 吧 =。=
    1. 用 make 的话用 browserify 封装。要不然用 webpack
    1. Origami 还可以转 JS!!!!! 真的假的
    zixincao
    zixincao
    May 11, 2015
    47
    报名了!
    chendeshen
    chendeshen
    May 11, 2015
    48
    已报名
    chendeshen
    chendeshen
    May 11, 2015
    49
    已报名~!!!
    WildCat
    WildCat
    May 11, 2015
    50
    @hayeah
    1. React 只是 view 啊, 其他层最好有大牛指导下~
    1. 好吧,只用过 gulp, webpack, grunt
    1. 额
    1. 嗯嗯,的确可以,不过只是看了看转换后的代码没有实现过。
    dragonszy
    dragonszy
    May 11, 2015
    51
    已报名!
    wuyazi
    wuyazi
    May 11, 2015
    52
    已报名
    shuiniushushu
    shuiniushushu
    May 11, 2015
    53
    我以前是做后端服务器,工作中常常接触前端,慢慢就喜欢上前端了。今年找了一份前端全职工作,算是半路出家了,我想看看牛人是怎么做前端的,好好学习一翻
    R4rvZ6agNVWr56V0
    R4rvZ6agNVWr56V0
    May 11, 2015❤️1
    54
    Sketch 那次课程参加了,现在可以轻松做UI原型啦,非常赞!
    Phoinikas
    Phoinikas
    May 11, 2015
    55
    课程设置是怎样的呢?什么时间什么方式得介绍下吧。。。
    timothyye
    timothyye
    May 11, 2015
    56
    赞一个,已发邮件报名
    BenX
    BenX
    May 11, 2015
    57
    发mail报名
    mingyun
    mingyun
    May 11, 2015
    58
    报名
    ywm8812
    ywm8812
    May 11, 2015
    59
    已发mail报名~
    ob
    ob
    May 11, 2015 via Android
    60
    关注了
    little_cup
    little_cup
    May 12, 2015
    61
    已报名~再次支持~
    mianju
    mianju
    May 12, 2015
    62
    作为前端才入门的人已报名> <
    freezhan
    freezhan
    May 12, 2015
    63
    前后端蒟蒻已报名~
    hayeah
    hayeah
    OP
    May 12, 2015
    64
    @Phoinikas 周五开始吧~ 形式比较特别,不太好解释。反正不看视频
    lj6684
    lj6684
    May 12, 2015
    65
    已报名+1
    robinshi2010
    robinshi2010
    May 12, 2015
    66
    支持!!!!已报名!
    hayeah
    hayeah
    OP
    May 12, 2015
    67
    谢谢大家的支持~ 现在报名的人数有点多,我们没把握照顾好各位。所以我们计划分成两个梯次来邀请大家,来保证教学质量。

    第一梯次邀请:明天发邀请(05/13/2015)
    第二梯次邀请:下周五发邀请 (05/20/2015)

    第二梯次持续接受报名 :)
    PeteHenry
    PeteHenry
    May 12, 2015
    68
    赞,一直没系统的学过前端,以发邮件报名
    jacob
    jacob
    May 12, 2015
    69
    我没看懂这个课程的形式是什么,是不是就是在线视频的形式(mooc,公开课),如果是这样的话,为什么需要报名呢,是想统计下有多少人有兴趣吗?
    peterwtu
    peterwtu
    May 12, 2015
    70
    一直对前端很感兴趣,这次找到福音了,已报名
    XiangNan
    XiangNan
    May 12, 2015
    71
    已报名
    hayeah
    hayeah
    OP
    May 12, 2015
    72
    @jacob 不是在线视频。我们需要控制人数。。。
    too
    too
    May 12, 2015
    73
    对课程很有兴趣,已发邮件报名。

    前端的话,我比较想学的就是如何将 UI 设计变成 HTML + CSS,比如Sketch做好的界面,如何高效的转化成真正的 HTML 页面代码。呃,这个比较偏向 UI 设计吧。
    vose
    vose
    May 13, 2015
    74
    已报名~
    iambic
    iambic
    May 14, 2015
    75
    赞 已报名
    smithtel
    smithtel
    Jun 2, 2015
    76
    第二期报名已结束?
    sunsh1ne
    sunsh1ne
    Jun 14, 2016
    77
    报名已经结束?不管,先举手报名呐(厚颜无耻脸)
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Privacy   ·   Solana   ·   1932 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 169ms · UTC 15:34 · PVG 23:34 · LAX 07:34 · JFK 10:34
    ♥ Do have faith in what you're doing.