第二天学习：前端开发技术概述

关键词：前端开发技术概述

晨跑计划：

　　

 

学习任务

  1. 走进前端工程师的世界
  2. 什么是前端开发者？
  3. Web开发概述与流程

2. 第一部分: 前端开发实践

学习记录

  • 前端开发工程师具备什么样的品质
    • 敏锐的前端嗅觉，页面优化能力，向用户展现良好的交互效果及用户体验，时刻学习新的技术　
  • 什么是前端开发者？
    • Web前端技术包括三个要素：
      • HTML（超文本标记语言）、CSS（层叠式样式表）和JavaScript（编程语言）
      • HTML、CSS作用是将PSD设计图转换成Web静态页面
      • JavaScript用来给HTML网页增加动态功能
      • 随着RIA（丰富的因特网应用程序）的流行和普及，Flash/Flex、Silverlight、XML和服务器端语言也是前端开发工程师应该掌握的。
    • Web前端开发工程师既要与上游的交互设计师、视觉设计师和产品经理沟通，又要与下游的服务器端工程师沟通
    • Web浏览器是用于检索, 呈现和遍历万维网(WWW)信息的软件，例如：Chrom
  • Web开发的流程
    • 前端工程师至少需要满足下列四类客户的需求：

      • 产品经理——这些是负责策划应用程序的一群人。他们能够想象出怎样通过应用程序来满足用户需求，一般来说，这些人追求的是丰富的功能。

      • UI设计师——这些人负责应用程序的视觉设计和交互模拟。他们关心的是用户对什么敏感、交互的一贯性以及整体的好用性。他们热衷于流畅靓丽但并不容易实现的用户界面。

      • 项目经理——这些人负责实际地运行和维护应用程序。项目管理的主要关注点，无外乎正常运行时间（uptime）——应用程序始终正常可用的时间、性能和截止日期。项目经理追求的目标往往是尽量保持事情的简单化，以及不在升级更新时引入新问题。

      • 最终用户——当然是应用程序的主要消费者。尽管我们不会经常与最终用户打交道，但他们的反馈意见至关重要；没人想用的应用程序毫无价值。最终用户要求最多的就是对个人有用的功能，以及竞争性产品所具备的功能。
    • 利用百度脑图做的流程图：　
      • 　　

 

  • 常用的网络技术：
    • Hyper Text Markup Language(超文本标记语言, 又称 HTML)
    • Cascading Style Sheets (层叠式样式表, 又称 CSS)
    • Document Object Model (文档对象模型, 又称 DOM)
    • JavaScript Programming Language (JavaScript编程语言, 又称: ECMAScript 6, ES6, JavaScript 2015)
    • Web API's (Web应用程序接口, 又称 HTML5 API 或浏览器 API)
    • Hypertext Transfer Protocol (超文本传输协议, 又称 HTTP)
    • Uniform Resource Locator's (统一资源定位符, 又称 URL)
    • JavaScript Object Notation (JavaScript对象表示, 又称 JSON)
    • Web Content Accessibility Guidelines (网页内容无障碍设计指南, 又称 WCAG) & Accessible Rich Internet Applications (富Internet应用程序的无障碍设计, 又称 ARIA)
  • 如何成为前端开发者：
    • 粗略了解 Web 是怎么工作的, 确保你知道域名, DNS, URL, HTTP, 网络, 浏览器, 服务器/服务托管, 数据库, JSON, API, HTML, CSS DOM 和 JavaScript了解这些的目的是确保你知道它们如何一起工作以及每部分用于做什么. 专注于高水平的前端架构概述. 从简单的网页 制作开始, 并简单学习一下 本机 Web 应用(又称 SPA).
    • 学习 HTML, CSS, 可访问性和 SEO.
    • 学习 UI 设计模式的基本原理, 交互设计, 用户体验设计和可用性
    • 学习编程的基本原理
    • 学习 JavaScript
    • 学习 JSON 和 API
    • 学习 CLI/命令行
    • 学习软件工程实践(如: 应用设计/架构, 模板, Git, 测试, 监控, 自动化, 代码质量, 开发方法学)
    • 定制自己的工具箱
    • 学习 Node.js

 

扩展阅读

学习资源

问题的记录与解决

  • 为什么在写Htlm代码前面要加<!DOCTYPE html>
    • 解答：页面添加<!DOCTYPE html>相当于开启了W3C的标准模式来解析渲染页面，防止浏览器使用自己怪异模式解析渲染页面。
    • <!DOCTYPE HTML PUBLIC"-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html14/strict.dtd">
      • 该DTD包含所有HTML元素和属性，但不包括展示性和弃用的元素（比如font），不允许框架集（Framesets）　　　　
posted @ 2016-07-05 23:41  桂  Views(232)  Comments(0)    收藏  举报