首页 > 前端开发 > 正文

web前端小白到独立开发 零基础开始学Web前端开发,有什么建议吗

2023-08-31 19:00:16 | 我爱编程网

web前端小白到独立开发 零基础开始学Web前端开发,有什么建议吗相关内容,小编在这里做了整理,希望能对大家有所帮助,关于web前端小白到独立开发 零基础开始学Web前端开发,有什么建议吗信息,一起来了解一下吧!

web前端小白到独立开发 零基础开始学Web前端开发,有什么建议吗

怎样自学web前端开发?

Web应用程序的开发过程

现在特征已经弄清楚了,我们就可以开始定义开发一个web应用程序的整个过程了。当然,这依赖于工程的大小,过程中的某些步骤可能很小,在你的脑海里就能完成这种工作,但把事情整个的了解一下总是有好处的。同时还有一点很重要的你要明白,这篇文章并不会对每个步骤进行深层次的描述。

步骤一:分析

开发一个web应用的第一步是分析你的需求。你此时应该定义出一个尽量周全的你的应用应该提供的功能清单。如果是你为一个客户做这些工作,你需要明白他们想要什么(要确保你们对方都知道对方在说些什么)。从你们的讨论中,你能总结出需求和软件规格。你即使是为自己开发,我也建议你把希望这个web应用能够做的功能写下来。

步骤二:设计

一旦你弄清楚了这个web应用需要做哪些事情,你就可以开始设计了。这个步骤通常会反反复复进行很多次,每一次都把设计细化一些。你第一要做的是画出页面流程图(画在纸上,或使用软件工具,凭各自所好吧。我喜欢用纸,这样我可以做更快速的改变)。页面流程图通常是很抽象的黑白绘画,画出你将要实现的web应用的样子(你可以加一些色彩,但尽量保持简单)。

这个步骤能够让你知道你的应用最终会是个什么样子。跟37signals倡导的相反,我建议使用一些词语描述,适度细化。当我想到一个很好的想法时,或想到事情该如何做时,我会把它标注到纸上(例如,当点击这个按钮时应该使另外一个元素改变或隐藏,我会把这写在流程图上)。

当你对做出的草图满意后,你可以开始制作实体模型了。

实体模型仍然是些图案,但有色彩和细节。最终的实体模型看起来应该像你将要实现的web应用的一个截屏图。如果你为一个客户开发,他会看看这些东西,并给你他的认可。然而,很多人都喜欢跳过这一步(大多数都是非设计人员),他们喜欢直接奔向网页原型。

原型是用HTML开发出来,使用CSS渲染(有时也是有Javascript)。页面布局要做出来,链接能够点,颜色,字体,字体大小要设定好(如果你做了实体模型,这个会很容易)。这一步非常的重要,因为这里所有的东西都能用于你最终的应用中。如果允许的话,在你的原型上做一些可用性测试,从长期的效果来看,这能使你避免大量的失误。

在这个步骤的最后,你基本上就知道了你的web应用是如何组织到一起的了。登录页面有些什么,用户如何从主页转向到各个页面。

步骤三:实现 选择一个框架

现在我们已经知道了要去开发什么东西,那就要把它做出来。这一部分的工作很多,你大部分的时间都要花在这个上面。你第一个要做的决定是如何着手,采用什么样的技术,什么框架。你有很多选择的余地,你需要选出一个适合你的。下面是一个最常用的框架的列表:

ASP.NET

PHP 上的任何一个流程的框架

Python with Django

Ruby on Rails

没有一个明确的标准说哪个框架最好。它们都各有不同,每个都有自己的长处。最重要的是你要知道它们任何一个都能让你开发出好用的web应用。

开发

一旦你知道了如何去开发,那就要甩开臂膀开干了。这个开发工作可以看作有很多块,但说到底,这都是标准的编程活动了。在后台,你要创建类,对象,服 务,过程,以及持久层来把这些对象保存到数据库中。后台是整个应用的核心,对任何应用来说,它跟普通的编程没有什么区别。接着是前台的开发,你现在编写的代码才是真正给用户使用的操作界面。你把后台的程序和原型界面集成到一起,把系统各部分集成到一起。你还可以把你在开发过程中想到的一些很炫的小功能用 JavaScript实现。

再说一次,有很多种途径可以实现后台程序。建议你去读一读跟你选择的框架相关的资料,弄清楚如何实现这一部分的工作。通常,这些知识会跟面向对象编程有关,但有些框架正在慢慢的向领域驱动设计发展。

步骤四:打磨抛光

现在应用程序已经开发出来,各个独立的模块也集成到了一起。你需要通过测试来确保你在步骤一中定义的需求和软件规格是否被实现(这个问题在你开发的整个过程中都要记在脑中)。你要确保那些愚蠢的用户不能通过试图做一些你还没有实现的操作而把你的应用弄坏(参考 白盒 和 黑盒测试)。你同时还要确保你的程序能够在各种浏览器里(希望不是IE6)都能正确的运行。

现在也是你做一些小的调整,改进你的应用程序给人的感觉的时候,让它趋于完美。

步骤五:发布和后续工作

这最后一步(但不是就此完结)是发布你的应用,让用户能够真正使用它(如果这个应用是个公众开发的应用,别忘了做新闻宣传)。如果你愿意,先发布一 个Beta版,这样只有一小部分用户能够发现你的应用里的大问题(因为你的程序里肯定会有bug),他们会帮助你改进程序的质量。不要忙着增加功能,要专注于把你目前的程序变的稳固。

当经过了beta阶段,你的程序已经变得十分的稳固,听取用户反馈的意见,自己试用一下自己的应用,你可以开始思考如何使应用变的更好。找出不和谐的地方,消除掉。以后每次的迭代都要经过上面所说的五个步骤,但就像我最初说的,你现在已经有了一个可以运行的应用程序,你很容易直接在心里完成这些步骤,直接奔向在代码里测试你的功能。

恭喜,你已经自豪的成为一个web应用程序的作者了。

web前端小白到独立开发 零基础开始学Web前端开发,有什么建议吗

Web前端工程师需要学会哪些技术?系统学习多久能独立完成项目?

第一阶段 前端页面重构

第二阶段 JS高级程序设计 我爱编程网

第三阶段 PC端全栈项目开发

第四阶段 移动端项目开发

第五阶段 WebApp后端系统开发

第六阶段 就业指导

1、HTML5

HTML是超级文本标记语言,是为“网页创建和其他可在网页浏览器中看到的信息”设计的语言。HTML5是由万维网发布的最新的语言规范,是开放的Web网络平台的奠基石,所以做Web前端,精通HTML5是必须要掌握的一项技能。

2、CSS3

CSS即层叠样式表(Cascading StyleSheet)。
在网页制作时采用层叠样式表技术,可以有效地对页面的布局、字体、颜色、背景和其它效果实现更加精确的控制。
只要对相应的代码做一些简单的修改,就可以改变同一页面的不同部分,或者页数不同的网页的外观和格式。

CSS3是CSS技术的升级版本,CSS3语言开发是朝着模块化发展的。以前的规范作为一个模块实在是太庞大而且比较复杂,所以,把它分解为一些小的模块,更多新的模块也被加入进来。这些模块包括:
盒子模型、列表模块、超链接方式 、语言模块 、背景和边框 、文字特效 、多栏布局等。CSS3对于Web前端整个页面的设计是必备的技能。

3、JavaScript

JavaScript一种直译式脚本语言,是一种动态类型、弱类型、基于原型的语言,内置支持类型。它的解释器被称为JavaScript引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在HTML(标准通用标记语言下的一个应用)网页上使用,用来给HTML网页增加动态功能,为用户提供更流畅美观的浏览效果。

掌握了JavaScript,你就可以给你的网页增加各种不同的动态效果,比如百叶窗特效,广告切换特效,浮动广告特效,上下无缝滚动特效等等。

4、jQuery

JQuery,顾名思义也就是JavaScript和查询(Query),即是辅助JavaScript开发的库。它是轻量级的JS库
,它兼容CSS3,还兼容各种浏览器(IE 6.0+, FF1.5+, Safari 2.0+, Opera
9.0+),JQuery2.0及后续版本将不再支持IE6/7/8浏览器。

JQuery使用户能更方便地处理HTML、EVENTS、实现动画效果,并且方便地为网站提供AJAX交互。熟练掌握JQuery会让你更好的使用JavaScript。

5、AJAX

AJAX即“Asynchronous JavaScript And
XML”(异步JavaScript和XML),是指一种创建交互式网页应用的网页开发技术,可以在不重新加载整个网页的情况下,对网页的某部分进行更新。

AJAX开发人员必须理解传统的MVC架构,这限制了应用层次之间的边界。同时,开发人员还需要考虑C/S环境的外部和使用AJAX技术来重定型MVC边界。最重要的是,AJAX开发人员必须禁止以页面集合的方式来考虑Web应用而需要将其认为是单个页面。一旦UI设计与服务架构之间的范围被严格区分开来后,开发人员就需要更新和变化的技术集合了。实现网站交互必须熟练掌握AJAX。

6、Bootstrap

Bootstrap,来自 Twitter,是目前很受欢迎的前端框架。Bootstrap 是基于 HTML、CSS、JavaScript
的,它简洁灵活,使得 Web 开发更加快捷。它由Twitter的设计师Mark Otto和Jacob
Thorn‍ton合作开发,是一个CSS/HTML框架。

Bootstrap提供了优雅的HTML和CSS规范,它即是由动态CSS语言Less写成。Bootstrap一经推出后颇受欢迎,一直是GitHub上的热门开源项目,包括NASA的MSNBC(微软全国广播公司)的Breaking
News都使用了该项目。国内一些移动开发者较为熟悉的框架,如WeX5前端开源框架等,也是基于Bootstrap源码进行性能优化而来。

Bootstrap中包含了丰富的Web组件,根据这些组件,可以快速的搭建一个漂亮、功能完备的网站。其中包括以下组件:下拉菜单、按钮组、按钮下拉菜单、导航、导航条、路径导航、分页、排版、缩略图、警告对话框、进度条、媒体对象等。时刻学习最近的前端框架也是Web前端工程师的必备技能

要成为一个优秀的前端,必须掌握除技术以外的东西,例如设计,用户等等。因为web前端分为两大方向,设计型和开发型,如果掌握这两大技术,等于拥有了企业最需要的技术技能,到时候你就是企业争相抢聘的人才。

如果是零基础的话,系统学习一般四个月就可以独立完成项目。

web前端小白到独立开发 零基础开始学Web前端开发,有什么建议吗

零基础开始学Web前端开发,有什么建议吗

我爱编程网(https://www.52biancheng.com)小编还为大家带来零基础开始学Web前端开发,有什么建议吗的相关内容。

一·前端零基础入门

从前端基础入门知识学起,掌握基本的HTML+CSS网页布局,以及简单的JS特效,最终可以独立开发出前端PC网页。

二·响应式开发与常用框架

使用H5+CSS3实现网页动态特效,通过Bootstrap框架学习,从原生编码过渡到框架使用,更高效的开发出适配各个设备的响应式网页。

三·组件化思想开发电商网页

学会H5进阶内容:svg、canvas、H5存储、拖拽上传等,对JS、jQuery进行提升,学习企业开发模式——组件化开发,在企业项目团队中协同合作,实现“高内聚、低耦合”的网页搭建。

四·热门框架Vue开发WebApp

学习JS的最新版本ES6,前端流行框架Vue.js,结合最流行的打包工具Webpack,掌握一个项目上线前的所有开发流程,真正成为一个能够满足企业需求的前端工程师。

以上就是web前端小白到独立开发 零基础开始学Web前端开发,有什么建议吗全部内容了,了解更多相关信息,关注我爱编程网。更多相关文章关注我爱编程网:www.52biancheng.com

免责声明:文章内容来自网络,如有侵权请及时联系删除。
与“web前端小白到独立开发 零基础开始学Web前端开发,有什么建议吗”相关推荐
java web开发工具有哪些
java web开发工具有哪些

javaweb开发工具有哪些1.JDK(Java开发工具包)如果你打算用Java开发一些小程序和应用程序,那么首先得给自己准备一个类似于JDK的工具,其中包括必要的JavaComplier、JavaRuntimeEnvironment(JRE)和JavaAPI。这是开始Java之旅的第一步。2.EclipseIDE如果咨询一些经验丰富的Java开发人员关于他们最喜欢的JavaI

2024-06-05 22:44:24
如何在spark基础二次开发基于java swing的pc客户端
如何在spark基础二次开发基于java swing的pc客户端

如何在spark基础二次开发基于javaswing的pc客户端packageorg.jivesoftware.spark.ui;importjava.util.ArrayList;importorg.jivesoftware.spark.util.log.Log;importorg.jivesoftware.spark.util.ModelUtil;importorg.j

2024-04-28 06:38:45
编程零基础应当如何开始学习 Python ?
编程零基础应当如何开始学习 Python ?

初学者怎样快速入门Python编程?了解Python编程基础首先第一点,要能够看懂了解变量、基础语法、编程规范等,这些事能够上手编写Python代码的前提。其次第二点,对于数据结构,字符串、列表、字典等需要比较熟练运用。刚开始的这部分就做一些简单的练习,构造出一个数据类型,然后再实现基本的用法。比如你自己构造一个列表,实现列表中数据的访问、更新、删除等基本操作,

2024-01-09 11:49:48
请问python后端开发一般需要什么技术?
请问python后端开发一般需要什么技术?

请问python后端开发一般需要什么技术?第一阶段:Python语言基础主要学习Python最基础知识,如Python3、数据类型、字符串、函数、类、文件操作等。阶段课程结束后,学员需要完成Pygame实战飞机大战、2048等项目。第二阶段:Python语言高级主要学习Python库、正则表达式、进程线程、爬虫、遍历以及MySQL数据库。第三阶段:Pythonweb

2024-01-20 06:43:40
哪里有JAVA开发板,软件开发平台,Web开发平台或快速开发平台的源码,包括工作流源码,还有JAVA OA源码?
哪里有JAVA开发板,软件开发平台,Web开发平台或快速开发平台的源码,包括工作流源码,还有JAVA OA源码?

初学者想学ARM嵌入式,应该选ARM9还是ARM11开发板?对于ARM嵌入式的初学者,建议用ARM9开发板。首先,从功能上来说,ARM11要比ARM9强一些,但是性能优异并不代表适合初学者。对于初学者来说ARM11的有些功能是冗余。其次,学习ARM9或者ARM11就在所难免学习其所支持的操作系统Linux(ARM11可以支持Android)。目前,市面上ARM9的开发版的价格要比AR

2024-07-03 16:24:53
零基础小白学Python编程要看哪些书?
零基础小白学Python编程要看哪些书?

零基础小白学Python编程要看哪些书?1.《"笨办法"学Python》推荐理由:本书是一本python入门书籍,比较适合没有计算机、编程基础,但是对python感兴趣的小白学习使用。这本书是以习题的方式一步一步引导读者了解、学习python,从简单的打印一直讲到完整项目的实践,让初学者从基础的python知识入手,最终体验到软件开发的基本过程。2.《Python学习手册》《

2024-02-12 00:49:19
学Python的发展前景好吗
学Python的发展前景好吗

学Python的发展前景好吗随着近几年Python的飞速发展,应用范围逐步趋于广泛,后端开发、前端开发、爬虫、金融量化分析、人工智能、自动化运维、自动化运维、大数据,Python都有涉及。Python相对其他编程语言来讲,语法较简单,就算没有任何编程基础,我们也可以学习和掌握Python编程开发,是新时代的宠儿!因此参加Python工程师培训机构的人越来越多。Python有很多吸引程

2023-12-16 03:19:15
怎么用java开发小游戏?
怎么用java开发小游戏?

怎么用java开发小游戏?深入探索Java游戏开发之旅:打造迷阵小游戏从零开始,跟随我们的200行代码,你将在一周内掌握Java小游戏开发!首先,我们来看一个简单的数字操作游戏——石头迷阵,玩家通过左右上下操作改变数字序列,每成功一步,系统会报出步数。游戏结束后,玩家可以轻松重启挑战。开发过程仅需Java基础,IDE如IntelliJIDEA就足够。主入口——`ma

2024-06-02 11:22:40