00:00
来呢,我们开始正式的来学习我们这个前端的一个知识,那我们先来干嘛呢?对我们这个课程做一个简介,所谓的课程简介就是来先了解一下我们到底要学什么,我们到底要做什么,诶那咱们先说第一个问题,那咱们咱们是学的什么呀?叫做前端工程师是吧?哎,前端工程师,那你们有没有想过,前端工程师到底是到底是干啥的?你有没有想过,你们想找工作,找工作以后你们到底是干嘛的?诶,你说我要我要我要当个厨师,我以后是给人家干嘛呀,炒菜的是吧,我要当个这个,哎,我要当个医生,我以后就给人家开堂的是吧?诶那我当个前端工程师,我们要干嘛的?哎,我们是做软件,无论是你学安卓也好,学Java也好,学PHP也好,等等一系列的所有的东西都是干嘛的,所有这些工程师全都是做什么呀?诶全都是去做软件的,所以这里边我们来说呢,诶其实不管是我们这个前端工程师,还是我们这个后台工程师,我们要做的工作无非就是什么呀?诶就是软件的开发,诶说白了以后我们就要开发软件的,那既然要开发软件,我们就要搞清楚我们软件到底它是什么样的,那我们就要说一下我们软件的一个什么呀,架构啊,软件的一个架构来,那这里边我一边写就一边一边说了啊,我们这里边说一个写一个名叫做一个前端的这个基础课程,那这里边儿我们来说一下,第一个我们叫做一个课程的一个剪辑。
01:31
店简介这里边要说什么呢?我们要说一个叫做我们这个软件的一个架构,诶那软件的架构,我们软件呢,它一般来说我们都分成两种架构,第一种我们叫一什么呢?叫做一个CS啊CS还有一种我们叫什么呢?叫做BS啊,CS还有这个BS,诶那这个我们来一个一个说,这两个分别代表什么意思,我们来看CS它是一个C,后边是一个斜杠S是吧,实际上它什么意思,它是两个词,C表示什么呢?哎,C表示的是我们这个客户端,而这个S表示什么呀?诶表示我们这个服务器啊,所以C叫CLA客户端,S叫server,诶server叫什么呀?服务器啊,Server叫服务器啊,客户端服务器这么一个结构,诶那我们来说一下什么叫做CS架构,什么叫CS架构?诶,我们来说一下,诶一般我们使用的这个。
02:31
什么呀,软件都是什么呀?CS架构的,诶CS架构的。哎,举个例子,比如说什么呢?比如我们这个,诶系统中的什么呀,系统中的这个软件有什么呀,比如说我们最典型的什么呀,QQ啊,我们的什么呀,360安全卫士啊,什么这种这种office啊,哎,包括我们用的什么呀,包括我现在用的这个X啊,哎,Ma的它都属于什么呀?都属于这个呀,CS架构啊,都属于C代架构,那到底CS架构到底什么意思呢?那我们先说CC表示什么呀?C客户哎表示我们这个客户端,那什么叫客户端,既然叫客户端,这东西是给谁用的,是不是给用户用的呀?那谁是用户啊,那现在来讲咱们是不是就是用户啊,诶咱们就是用户,那所以C表示客户端,我们在干嘛呢?我们用户通过我们的这个客户端来干嘛呀?来使用软件啊,用户来通过我们这个客户端来使用软件,说白了我们现在看到的叫什么。
03:38
这是不是就客户端呀,哎,这个可户能,比如说你打开QQ,你这一登录,一输入用户名,一输入密码一登录,这是不是出来有点像我们这个飞Q这么一个结构呀,这就什么呀,这就是客户端,只要我们看到的,我们是通过什么呀,客户端来使用软件的,所以我们看到这些东西全都全都是什么呀,全都是客户端啊,全都是客户端,哎,那接着来说还有什么呀,我们的S表是什么呀?哎,S表示我们这个服务器啊,S表示服务器,那什么叫服务器呀,那我们想想,如果你QQ你仅有一个客户端,或者干脆说如果你电脑上没有网,你的QQ能不能用。
04:20
能不能用,不能用,为什么为什么?哎没有网,你是不是就连接不到那个QQ的服务器啊,连接到不到那个服务器,你的消息就干嘛呀,就发不出去,所以你的QQ干嘛呀就不能使用,那什么叫服务器啊,服务器负责干嘛呢?诶负责诶处理我们这个软件的什么呀?业务逻辑,什么叫业务逻辑啊,也就是说咱们举个例子,还是拿QQ举例子,QQ的业务逻辑是什么呀?是不是就是聊天啊,哎,也就是说你要发一个消息,你A小A跟这个小B聊天干嘛呢?你发个消息,你是不是要发给小B呀,你能不能发给小C呀,不行,那你发给B还是发给C,这就什么呀,这就是业务逻辑,那我们说这QQ它是怎么发消息的呀?那举个例子,我们发消息,我们用的是什么?
05:13
是不是客户端呀?哎,我们通过客户端来使用这个软件,我这发个消息让我发送给谁呀?诶,那我们说服务器,我得我的消息最终得发送给服务器,那问题又来了,服务器在哪呢?服务器咱们先说客户端在哪吧,脑客户端是不是在我自己电脑里啊,只有在我自己电脑里我才能使用这个软件,那服务器在哪呢?服务器准备跟哪儿了是吧,反正肯定不在我电脑里对吧,他没准跟北京的跟广州呢,跟深圳的跟上海的准备跟哪儿了?反正是一个什么呀,一个远程的一个位置能理解吧,哎,那我们在聊天的时候,我发一个,哎,我发现一个,诶小A我好想你,那怎么办呀,他这消息发哪去了,是不是直接发小A那去了,不是发哪去了,哎发到服务器那去了,服务器收到啊,他好想小A是吧,那这个信息发送给谁呀?发给小A,那可能小A跟这呢,他这个信息再转给什么呀。
06:09
小A,诶,所以我们发现我们所有的数据是不是最终都要发送给我们这个服务器去处理啊,哎,服务器处理啊,所以服务器就这么一个作用,那现在基本上你说有没有哪个软件,它没有服务器的很少,诶除非以前那种什么呀,纯单机游戏它可能没有服务器,但是一般现在这种东西干嘛了,很少了,大部分软件都需要什么呀,都需要联网,包括你的360啊,包括你的word呀,360需要联网去更新,对吧?诶word也需要去联网,去保在云端上保存一些东西啊,所以这里边注意,目前我们这个软件大部分都是什么呀。都是CS啊,都是CS架构的软件,诶,那我们说CS架构软件它有什么,有什么特点吗。我们来说一下,首先我们来说你要用QQ你得先干嘛呀,诶下载试一事,我们得先干嘛呀,是不是安装啊,诶下载完了你得先要安装,所以这种CS架构软件,诶我们说软件诶必须使用前必须得安装,也就是说你这QQ你要不装你是不是没法用啊,最不济你说我不装,你也得把QQ那个软文件拷贝到你的硬盘上吧,诶硬盘上,所以这个是给安照过去了啊,叫做必须得安装啊,安装然后第二一个呢,还有什么特点啊。
07:30
哎,我们说了,假如说。腾讯有一天高兴QQ要更新了,那他那你你这个客户端用不用更新啊,是不是也得更新啊,哎,他老给你弹出提示,哎QQ需要更新了,点击确定更新,现在更不要脸了,干嘛呀,提示都不给你弹了,诶后台是不是敲门就更新了呀?诶所以这边叫什么呀,软件更新时,我们这个服务器和诶客户端干嘛呀?诶得同时更新啊同时更新像我这个QQ这图标好像这两天又变了,我都没我都不知道他上时候变的是吧?诶悄米丁的变了,这企鹅好像瘦了是吧?诶企鹅瘦了他也没跟我商量是吧,也没跟我商量啊好,那这也是我们说往往什么呀,一更新服务器和客户端都得什么呀,同时更新,那现在已经方便多了,现在干嘛呀,我一更新点一个按钮,它是不是自己就更新了呀,最早的时候可能以前我要更新一个软件,我还在干嘛呀,打补丁是一个是吧,我可能得先那什么呀,卸载这个软件。
08:33
这软件你要是没卸载干净干嘛呢?你还装不上啊,你装不上,所以现在我们这软件使用起来已经方便多了啊,就方便多了,诶那还有什么特点呀,还有什么特点,诶我们来说一个它的这个,这还有什么呢?我们叫做软件叫什么呀?CS架构的这个软件干嘛呢?不能跨跨哎平台使用不能跨平台使用,那什么叫平台呀。
09:06
那叫平台呀,平台说白了就是什么呀,就是我们系统啊系统我这个是什么呀,Windows系统你手机里那可能什么呀,安卓系统还能是什么呀,IOS系统可能其他电脑里是Mac可能还是什么呀,Linux也就是说我们的系统就是什么呀,就是平台,那所谓的跨平台就是不能什么呀,跨系统,诶那怎么就不能跨系统了,我问你,诶我这个QQ我能不能在手机里用啊,诶我能不能在Linux里用啊,诶我能不能在什么这个Mac里用啊,都不能,诶同学有疑问了,诶老师我这个手机里干嘛呀?有QQ,我手机里是不是也能用QQ啊,他不是能跨平台吗?但注意你手机里那个QQ是干嘛的呀,是那个安卓版或者iOS版的QQ吧,而我们这个QQ是我什么呀?是一个点exe文件吧,这个文件在你手机里能运行吗?哎,不能运行,这个文件只能在我们的这个Windows里运行啊,Window里行,所以我们的CS架构软件是不能跨平台的,如果想要跨平台怎么办?
10:14
你得在比如说拿QQ举例子,你想在不同的系统上使用,你得干嘛呀,你得开发一个Windows版的,你还得开发一个什么呀,安卓版的你还得开发一个什么呀,IOS版的你还得开发一个呀,Linux版的你还得发一个什么呀,Mac版的也就是说你要想跨平台,你是不是在一个平台里边开发一个什么呀版本,所以这个东西干嘛呀,很麻烦啊,它不能跨平台使用啊,不能跨平台使用,然后再来说还有什么呀,诶还有一个特点叫什么呢?诶CS架构的软件干嘛呀,诶他使用的诶叫什么呀。客户端和我们这个服务器通信干嘛呢?诶采用的是这个自有协议啊,自有协议或者叫自定义协议,诶所以什么呢?诶我们说,诶所以它相相对来说什么呢?相对来说比较安全啊,相对来说比较安全,那这句话什么意思,什么东西什么叫做协议呢?什么叫协议呢?那我们刚才说了,我们使用软件的时候,我们是通过什么呀,客户端来使用软件,我们信息是不是最终都得发送给服务器啊,诶发送给服务器,那好了,那信息发送给服务器,这个发送是不是通过我们这个。
11:33
网络发送的呀,哎,网络发送,那你想想他这个信息它怎么发送啊。怎么发送啊,他是不是得通过我们这个电话线,或者是通过我们这个路由器去往这个服务器去发呀,那好了,那既然是发送出去了,一到放在网络上,它还有没有什么秘密可言呀。没有什么秘密可言,也就是说我这个信息能被服务器的东西给他收到,也能干嘛呢,是不是也能被这些别有用心的人给他干嘛了呀,是不是截获了呀,诶截货了,所以你们以后注意你们上网吧上网的时候,只要这个网吧他有心干嘛呀,在他路由器上加一个这个补货工具,你干什么东西,网吧干嘛呀,全都能知道,诶他想知道全都能知道,那我们说了,那那那就意味着我们这软件使用起来是不是是不是不安全了呀,那注意了,我们说一下,那我这信息我是不是就直接发了,比如说我说一个你好,他是不是就给我发送一个你好啊。
12:27
不会吧,哎,不会,就像我们过去什么呀,我们过去什么呀,看过那种谍战片吧,地下党,我这个地下党,我要跟这个延安联系,怎么办呀,我是拍电报啊,但是拍电报问题来了,我这个电电报干嘛呀,我党能收到。国民党能不能收着,日本鬼子是不是也能收着?那问题来了,你这东西发出去以后,是不是全世界都知道了,那怎么办呀?哎,我们是不是得对对对这个信息进行加密啊,所以拍电报的他是不是都有一个密码本啊,那我们想想,咱们地下党拍电报都得加密,那我们客户端和服务器端发的一个信息干嘛呀?
13:10
是不是也得加密啊,那是加密是不是得有一个密码本啊,哎,密码本,那这个协议就干嘛呢?就相当于是什么呀,密码本啊,协议就相当于是密码本,诶那我们说了,那们说了腾讯客户端和服务器之间通信这个协议谁定的呀。是不是他自己定的呀,就像我们这个我党地下党的密码本肯定是也是我们共产党自己干嘛呀,自己定的,那既然是自己定的,别人知不知道,别人不知道,别人不知道那就意味着什么呀,即使别人截获到了我这个信息,他干嘛呀,他是不是读不出来呀,哎,读不出来,所以这种的我们来说叫做相对来说干嘛呀比较安全,只要我这个协议是保密的,我们的通信内容干嘛呀都是什么呀,安全的啊,都是安全的,好这一块是我们说的这个CS架构的软件这么一个诶特点啊,虽然CS,再说我们这个BSBS你看我写的和这个CS很像,只不过是把C换成了B啊,那B表示什么意思?诶,B表示叫做brother啊,Brother叫什么呀?浏览器,诶浏览器S同样也是什么呀,也是服务器啊,也是服务器,那我们来说说一下什么呢?诶BS它和CS有没有什么本质的区别啊,其实没有啥本质区别B。
14:30
S什么呢?本质上什么呀,也是CS啊,BS本质上也是CS啊,也CS,但是那它有什么不同呢?只不过什么呢,只不过在我们这什么呀,我们这个BS架构的软件,它干嘛呢?它使用什么呀,使用我们这个浏览器作为什么呀,作为我们这个软件的。
15:00
客户端啊,那我们来说CS,我们叫什么呀,你像我这就是一个CS架构软件,它使用什么作业客户端呀,我这叫什么呀,叫做图形化界面吧,它是用什么呀,用我们这个C语言干嘛呀,画出来这么一个图形,这是绘制出来一个图形啊,这叫图形化界面,而我们这个BS呢,它是使用什么呀,使用浏览器作为软件的客户端的,诶浏览器怎么作为软件客户端,我一打开浏览器,浏览器什么玩意儿啊。浏览器是不是白茫茫的一片呀,它怎么作为客户端呀?哎,我们说BS架构软件通过什么呢?通过使用我们这个浏览器干呢?诶访问网页的这个形式来干嘛呢?来使用软件啊,来使用软件,所以这里边注意我们BIS代购软件,它的页面,它的界面都是什么呀,都是网页啊,界面都是网页啊,它是以网页的形式来使用软件的,那我们说诶那S还有没有什么区别啊,哎,S都是服务器的意思啊,S都是服务器的意思来我们来说,比如。
16:11
我们用个什么BS啊,加购者哎,我们的什么呀,京东啊,什么淘宝啊,什么幺啊,306啊,比如用的还有什么呀,还有什么知乎啊等等,包括什么呀,包括新浪微博啊等等,这些全都是什么呀,全都是BS架构的软件,诶同学说了,诶老师这些东西它不都是网站吗。怎么转眼就变成什么了,变成软件了呀,诶我们说网站它一般干嘛呀,网站的意思一般都指什么呀?只能单一的去显示数据,也如说你有个新闻,你个信息,你可以在网站干嘛呀显示,而像京东啊,淘宝啊,要是在六大,知乎啊,新浪这些东西,它是不是仅仅能看东西啊,比如说京东淘宝1366,我是不是能买东西啊,哎,知乎啊新浪啊这些我是不是能发东西啊,包括还有什么打赏,我是不还能给人给人钱呀,诶给人钱,所以这些网站已经基本上干嘛了,已经不是一个简单的网站了,他们严格意见来讲叫什么呀?叫做application,叫application,你手机里边有什么呀,叫APP是吧?诶叫做应用,严格来讲,他们已经是一个什么呀,已应用了,所以这些我们所访问的网站大部分全都是什么呀,全都是BS架构的啊,全都是BS架构的,诶那么说他们有什么特点,他们有什么特点,第一个用不用装啊,诶软件干嘛呀,不需要安装。
17:37
诶不需要安装那怎么用啊,不装怎么用啊,你要用淘宝怎么办?诶打开浏览器是不是3W点点淘宝就行了呀,诶点淘宝行了啊,所以软件不需要安装直接什么呢?直接使用浏览器干嘛呀,访问指定的这个网址是不是即可呀?哎,不需要安装直接用,诶然后第二一个你叫什么呀,还有什么呀,软件更新的时候,我客户端用不用更新啊,哎,我们说你想想你在什么呀,淘宝假如说网站改版了,它会不会给你浏览器弹出一个提示啊,请更新你的页面啊,用不用啊。
18:14
不用他干嘛呀,他连商量都不跟你商量是吧,诶某的一天你打开淘宝点com,你发现干嘛了页面。变了,诶他怎么都没跟我说呀,用不用跟你说呀,哎不用跟你说,所以这叫什么呀,软件更新是什么呢?诶客户端干嘛呀?诶客户端不需要更新,他说只更新谁呀,只更新它的什么呀,服务器,服务器一更新你软件的界面就干嘛了,就变了啊就变了这是一个,那然后还有什么呢?诶我们说BS能不能跨平台啊,诶软件可以什么呀,可以跨平台使用。诶只要什么呢?只要我们的这个系统中干嘛呢?诶有浏览器是不是就可以使用啊,哎,就可以使用,比如说我们3W点淘宝点com我这个网站,我在我的Windows上能不能访问,诶我在Linux上能不能访问,哎我在我的Mac上是不是也能访问啊,包括你在你的iOS,在你的安卓上是不是都可以访问啊,因为我们这个软件实际上就是一个网站,我们只要有浏览器。
19:27
是不是就能用啊,哎,就能用,所以它呢可以跨平台使用,包括还有什么呀,我们的QQ是不是都有一个web QQ啊,哎,你通过一个浏览器你就直接能聊天了啊,包括微信也在网上也可以去发,所以这里边都是干嘛呀,它可以跨平台去使用的,所以那我们这BS相比来说CS。它的开发成本是不是低多了呀,同样一个软件,我开发完了,我开发完了所有平台是不是都能用了呀?诶,那也就是说我如果开发web,我只有一个什么呀,我只有一个前端小组,诶HVR小组我干嘛呀,我开发一个软件,我所有平台都干嘛了,都可以用了,包括iOS,包括安卓都可以用了,但是如果你做的是CS,你想做一个安卓客户端,那这个客户端干嘛呀,是不是只能在安卓上用啊,如果你要想开发iOS,你还得干嘛呀,你还得招一批这个iOS程序员,如果你想兼容这个哎,这个Mac,你还得招一批什么呀Mac的程序员。所以我们会发现CS架构软件开发成本往往比我们这BS干嘛呀要高很多啊,CS开发成本要高很多,因为我们要兼容不同的系统,当然你说我就我就兼容安卓,那就没得说了是吧,诶你就兼容安卓,那你就不用不用考虑问题啊,好可以跨平台使用,然后第四一个呢,那既然又涉及到我们这个浏览器和服务器的,那问题来了,浏览器和服务器之间。
20:46
是不是也得通信呀,哎也得通信,那这里边来说了,我们叫什么呢?BS架构的这个软件我们叫什么呢?诶客户端和我们这个服务器之间干嘛呢?诶通信采用的是什么呀?通用的什么呀?HTTP协议二采用的是通用的HTP协议,什么叫通用的HP协议,什么叫通用啊。
21:18
说白了,就像我们这个地下党发电报,他用什么呀?用铭文发布用什么呀,用那个摩斯电码发布,摩斯电码是谁都知道啊,诶用铭文发布,那你无异于干嘛呀,无异于在大马路上喊,对吧,谁都能看见,所以这协议干嘛呀,既然叫通用的意味着什么呀?谁都知道,我知道你知道大家干嘛呀,都知道你现在不知道,因为什么呀,因为你还没学呢,哎,学完了就知道了啊学你知道这是一个通用的,那就带来一个问题,那这东西既然是通用的,大家都知道,也就说你这个密码本是不是每个人都有啊,那他什么呀,相对来说干嘛呀?哎,不安全啊,相对来说不安全,但安全性呢,没有我们这个CS架构软件那么那么高啊,那么高,那是不是就说它绝对是不安全的呀?
22:08
不是,虽然HTP协议本身不安全,那我们说了,我们可以通过这个程序的形式干嘛呀,增加它安全性,他没给我们加密,我可以在干嘛,我在程序里是不是自己加密啊,诶自己加密那引有什么呢?我们除了HTTP协议还有叫什么呀,HTTPS协议他是什么玩意儿呢?它是在我们这个HTP协议的基础上加了一个安全套决字,把我们这个HT协议变成一个什么呀,安全的协议,所以以后注意你们上网的时候,如果你涉及到什么呀,什么网银呀等等一些涉及到你核心利益的这些操作的时候,你要看他那个协议名,浏览器前面你输入的时候,它有一协议名,它如果写的是HTTC什么什么这东西干嘛呀,它就是不安全的协议,所以一定要涉及到网银这些东西,凡是HP的你都记住别用,包括现在百度都已经换成什么了,HTTPS了啊,HDS了啊,所以这块一定要注意啊,好,那这也是我们说的一个特点啊,那简单的说完了,我们说了CS还有BS,我们简单的去介绍了一下,那我们说了,那咱们到底是要干啥的?
23:09
哎,咱们是不是要做这个BS的呀?哎,咱们要做这个BS,所以给它插一个小题啊,咱们是做这个BS的,哎,那这里边那咱们说咱们这个安卓那帮哥们干嘛的呀?哎,做CS,而且他们主要什么呀,主要做C啊,主要做客户端,而我们做那什么呀,张一那帮哥们干嘛的呀?哎其实他们严格来讲也是什么呀,也是BS啊,也是BS,但是他们主要负责谁呀?哎,负责这个S,负责服务器,那咱们主要咱们整谁呀,咱们主要其实主要是整浏览器的,也就说咱们主要是写一些什么呀页面的,但是服务器这块东西咱们也要干嘛呀,也要涉及到啊,也要涉及到,而且我们说整个一个发展趋势,实际上BS的趋势会更更更什么呀,更好一些,它的成本更低,通用性更高,维护起来也更容易啊,维护起来也更容易,诶,那好,那我们已经知道我们要做上了,我们就是要做这个BS架构的一个软件。
24:09
这也就是说我们主要是开发这个浏览器的,也就说主要是写页面的啊写页面的好,那刚才我们简单的介绍了一下我们这个什么是BS,就不再多说了啊,就不再多说了,然后我们要说一下我们这个一个软件,简单的去说一下它的一个开发流程,什么开发流程呢?那首先第一个我们要做软件,我得先干嘛呀,计我得先,其实设计之前我得先干嘛呀,产品经理先对我们这个成,对我们整个项目进行一个什么呀?需求分析,什么叫需求分析啊,我做一个软件,我这软件给我客户吧,我的客户是谁,我的客户有什么样的需求,我把需求分析分析出来,然后干嘛呢?我要去设计什么呀?页面,诶我的客户他喜欢什么页面干嘛呢?我把这个页面设计成什么呀,设计成一个图啊,设计图,那这一块我们这个图一般都是什么呢?通过我们这个我们的Photoshop来设计的,那也就是说网页设计师根据我们这个需求来干嘛呢?来设计网页,那设计完网页是不是就完事了呀,他们设计出出的网页什么玩意儿啊,诶可能类似于这种东西,他们设计出那玩意儿就是一个什么呀,就是一个图片,这个图片呢,它的可能稍微的白一点,但是它也是一个什么呀,也是一个图片,虽然很漂亮,那我们说这东西我能不能。
25:28
能不能直接放到网页上用啊,哎,你说我这截一个大图干嘛呢?直接以一个图片的形式引入到网页行不行啊,也行,但是你引入了以后会出现什么问题啊,这链接什么的能不能点呀?哎,不能点,也就是说设计师设计出那个网页,它只是一个设计图,它是干嘛呀,它是不能用,诶那完事该干嘛了,该干嘛了,设计师设计完了该谁进来了,该咱们这个前端工程师了,前端工程师干嘛呢?他要将我们这个设计图转换成我们什么样静态的网页,转成什么样呢?诶简单说一下,我们这里边也有举个例子,比如说我这个,诶这是我们后期要做这么一个练习,诶那这一块我们会会发现跟这图显示的是一模一样啊,但是它有没有什么区别呀,这就是什么了,哎,这就是网页了,而我们这个只是一个什么呀,只是一个图,说白了我们要把图干嘛呀,转换成这。
26:28
这个,但是它也不是这个,它我们要看什么呀,右键查看它的什么呀,诶我们这个查看它的这个页面的源代码,哎,我们最后写出来效果应该什么呀,应该是这样,也就是说干嘛呢,我们要将设计师的这个设计图转换成我们的什么呀,代码啊,转换成我们这个代码,好,那这块接着来说,那好了,那我们的工作完成了,我们已经将这个设计图转换成代码了,但是注意这个网页它是一个什么呀,它是一个静态的网页,什么叫静态的?哎,说白了它里边东西都是什么呀?死的哎,都是死的,什么叫死的呀?举个例子,比如说我们京东的一个商品页,京东商品页里面是不是有一个一个的这个商品呀,那什么叫静态的呀,我这商品都是干嘛的呀,写死的,也就说你能不能改呀,不能改啊,不能改,那我们说静态网页行不行啊,能不能用啊。
27:25
其实你要是凑合用吧,他也能用,那什么意思呀,那你无非就把这商品都写死了呗,那举举个例子,我京东干嘛呢?京东有30万商品,当然他肯定比这个多是吧,30万件商品,那我写死什么意思,我把这30万件商品都在网页里干嘛呀,都给它写上行不行?行,咱们不嫌麻烦,其实可以是吧,诶可以,诶那我们说有没有什么问题。诶,有一天京东干嘛呀,做促销,我这30万件商品里边干嘛呢,有158865件干嘛呢。
28:03
要做特价,那你打什么呢?打六折,那也就说干嘛呀,那你怎么办了,那你我们说了这里边都是什么呀,静态的,那你得干嘛,你得先从这个30万商品里边找到这158865件,然后干嘛呀,然后是不是一样一样改啊,等你改完了。都过年了对吧?哎,所以这里边我们静态网页一般我们是用不了的啊,我们用不了的,那接下来干嘛呢?由我们的这个后台工程师介入,他干嘛呢?他需要把我们这个页面改为什么呀,改为动态页面,也就是说我们这个网页里的数据,包括你看京东里边它那些商品信息实际上都在哪呢?在我们的数据库服务器里呢,我们后台工人干嘛呢?将这些数据从数据库里取出来,然后在我们的页面里干嘛呀,显示啊显示,那这个对于我们的这个后Java工程师来说,就给你换成什么呀,换成GSP,对于什么呀,PHP来说可能就换成什么呀,PHPHP页面啊,PHP样,那你会发现我们的工作正好在哪啊,是不是正好在中间了,哎,设计图交给我们,改成页面,再把页面交给谁呢?交给我们的这个后台工程师,所以这一块要求我们干嘛呢?诶你是不是得跟。
29:24
设计师进行交流啊,你还得干嘛呀,你还得跟后台工程师是不是进行交流啊,哎,所以我们这个位置正好是一个什么呀,承上启下这么一个位置,所以要求我们干嘛呢?设计的东西你得干嘛呀,你得懂点,服务器的东西呢,哎,你还得懂点啊,你还得懂点,所以对我们的要求来说,就是比较比较高啊,比较高诶那好了,这一块我们说了,设计的师的网页往往是这样的,是一个图片,然后我们需要把它转换成一个什么呀,代码啊代码,然后这就不多说了,诶那现在你知道了吗?我们要将设计师的设计转换代码,然后呢,交给后台工程师,再由他们去编写服务器的一个代码,那其实呢,我们说了,其实这种模式啊,我们说了先设计,再转成页面,再转成动态页面这种模式,其实我们的工作是比较什么呀,比较轻松的,为什么叫比较轻松呢?我们的工作到哪就停了。
30:17
到这就停了,我们做完了静态页面,静态页面就直接干嘛了,交给交给谁了,交给后台工程师了,说白了这东西你给他,你连看你都看不着了,后边的所有工作都是什么呀,都是后台工程师来完成的,诶那实际上这个东西对我们的要求比较低,这是一个传统的模式,那现在这个模式已经发生变化了,那现在是什么样?那我们先想想这个模式它有什么问题,有什么问题,诶那我们知道我们前端工程师是不是专业去设计去编写这个网页的呀,好,那你写的网页写的很好,结构、表现、行为三者分离啊,写的都很完美,很完美,好那现在你把这个页面交给谁呢?交给这个后台工程师了,那我们说了,后台工程师一般都是什么呀,一般都是一帮不太讲究的人。
31:10
什么不太讲究的人啊,他会不会去考虑你的结构表现行为什么这种耦合的关系啊,基本上不会考虑一半东西,他干嘛呀,他怎么写代码呢,他怎么方便怎么写啊,那可能干嘛呢?你设计的很好的一个网页,一旦交到了后台工程师的手里干嘛了?你会发现面目全非。啊,面目全非,诶那我们说了,现在这个社会我们是不是越来越注重客户体验了,哎,越来越注重我们的用户体验了,那问题就来了,我问你用户能不能看见后台呀,看不见吧,你后台写的跟什么似的,用户他也看不见,你写的再烂,再次用户他也看不见,所以用户第一个看的也是他唯一能看到,指的是只有这样,是不是只有我们这个前台页面啊好,那问题来了,用户看到这个前面的页面以后干嘛呢?这个页面是经过后台工程师手里处理的,就导致什么呀,用户他总是干嘛呀,得不到一个什么呀,最佳的体验,得不到一个完美体验,包括我们的页面可能对搜索引擎也并不友好,所以后来干嘛呢?我们又改进了一种模式,那这种模式什么样呢?我们页面写完了还给不给他们了,不给他们为什么?因为给他们太东西了是吧,你就像嘛呀,你你你打的挺好的一个孩子。
32:33
交给了后台工程师,后台给你一折腾干嘛了?哎,就是这变成一个小小乞丐那种样子是吧?你会干嘛呀,很伤心,所以现在干嘛呢?得了,我做完了干啥呀?不给你了,这面后台干嘛呀,你压根就看不见,那问题来了,你不让后台看到我们这个页面是不是还是静态页面啊,不能满足需求,那怎么办呢?有我们前端干嘛呢?给后台提需求,我要什么什么样的数据你干嘛呢?你给我提供一个什么什么样的接口,通过这个接口你要给我返回哪些信息,我们干嘛呀?我给你提需求,你直接给我定义接口,我的代码干嘛呀,不让你碰接口定义好了,我将这些信息干嘛呢?在页面里边去。
33:24
显示啊,我在这个页面里显示,那这样后台还看见看不见我的页面了,就看不见了,也就是说这个页面是不是一直在我们前端手里控制啊,前端手里控制,那这种模式呢,是一个比较现在用的比较多的一种模式,但是现在呢,你先了解一下有些接口啊,什么东西,可能现在听的还不太明白啊,暂时先了解一下啊,了解一下这是一种模式啊,那这种模式你就可想而知,对于我们的要求是不是就。要高一些了,还要高一些了,但是呢,还有一种模式,还一种模式什么呢?还有一种模式现在用的不是很多,可能在阿里啊,在美团一些公司,它的一些小模块里啊,或者一些小的小的项目里边,它尝试在用那什么模式呢?我们知道我们要学的语言,一个叫什么呀,叫做一个GSGS是什么呀?诶javascript的用我们什么呀,用来做我们这个页面的一些这种交互效果的,那还有一个原叫什么呢?叫做no。
34:20
GS note GS干嘛的?Note GS是用来写服务器,它用什么呢?它就是通过我们这个GS来编写我们这个服务器,那也就是说了,GS它既能写页面又能写什么了,又能写服务器了,诶那这一想,也就是说我们前GS谁擅长啊?是不是我们前端擅长GS呀?诶,那也就是说我所擅长这个GS也也能写什么了,也能写服务器了,那你后台工程师我还要不要了?咔,给他来个叉子干嘛呀,滚蛋不要你了,那不要你怎么办呢?我前台写完页面直接干嘛呀,直接写。
35:03
服务器,诶页面和服务器都是我写的,那这块包括维护起来,包括我这个页面,整个服务器的一个统一的思想,是不是都会比这种方式要好一些呀,哎,要好一些,但是这会带来一个什么问题啊,我们既得写页面,还得写服务器,那就意味着对我们这个前端的要求干嘛呀?是不是就非常高了,那这块其实已经不能叫前端了,可以叫什么呀,叫全站工程师了,也就说我什么都能干了啊,什么能干了,所以这种工程师的要求会干嘛呀,会非常高,但是可想而知,他们的待干嘛呀,是不是也不会低啊,为什么你一人是不是你干了干俩的事呢?哎,干俩事所以待遇也不会低啊,所以我们的最终目标呢,我希望你们最终都能发展成一个什么呀,全占工时,也就是说我既能写页面还能写什么呀,服务器,这样你们未来的发展一定是很好的啊,一定很好的好,那这里边我们说了,那我们就简单的了解了一下我们前端,那你就知道了,我们这个前端其实需要掌握东西是不是不少啊,你既要懂这个设计,懂一点设计,还要能写页面,甚至说再高要求点,还要能写什么呀,能写服务器啊,能写服务器,那现在我们就带来一个问题叫什么呀。
36:12
前端技术。好学吗?好学吗?诶,那你们来这儿的印象可能觉得他前端是不是。简单一点啊,哎,前端技术呢,简单好学,其实呢,这是我们的一个什么呀,一个误区啊,一个误区,就像看那什么呀,哎,看那个少林足球一样,那个周星驰说什么呀,这叫什么功夫,只能用来打打杀杀,是大家对他的什么呀,误解,同样前端技术简单好学的也是一个误解,前端技术简不简单呢,简单诶那我们对比谁来说呢?对比Java来说,Java什么特点呢?Java它是干嘛呀,入门难,怎么叫入门难,加上那帮哥们呢,苦学一个月,一个多月学,学了一个多月干嘛呢?他不知道他要干嘛,也就说他学了一个月吧,他什么东西也看不见,因为这东西比较抽象,我学家伙到底是要干嘛的呀,这一个月他会干嘛呀,他会特别难受,入门干嘛呢,特别难,但是一旦入了门以后,往后再走干嘛呀?
37:14
一把平出来会很平坦啊,会平坦,而我们什么呢?而我们这个前端技术有什么特点呢?入门干嘛呀非常简单,今天上来我们就要写页面,你写页面怎么叫什么呀,所见即写即所得,你写完了它就是这样的,所以你学起来干嘛呀很容易,但是你发现这东西吧,你学完A苗。诶挺简单的,学完CSS呢也挺简单的,甚至学GS时候也觉得干嘛呀也结挺简单的,但当你学完这一个月以后,你想干嘛呀,我回过头来再去看我所学的东西,你越越学越发现什么呀。这东西怎么感觉越学越多呀,这H这个CSS,尤其是这个CSS和GS,你发现什么呢?这东西学不完,越学越多,越学越多,越学越觉得难,越学的越,越学越觉得这什么呀,学无止境,所以我们这个前端和这个后台呢,正好相反,这个Java那块儿是干嘛呀入门难,但是我们这块干嘛呀入门简单深入起来比较比较难,所以这里边你们要做好什么呀,心理准备啊,心理准备前一个月呢,或者说前半个月呢,相对来说会干嘛呀,会轻松一点,你会觉得很so easy是吧,就是老的天下第一,没有我学不会的了是吧,没有学不会的,等过到一个月呢,你学完GS你要学什么呀,学no的以后,你会发现整个人都感觉不好了,哎,特别的哎呦,感觉就是那种那种想死的感觉。
38:45
但注意啊,越是这种难学的东西,就意味着你学好了以后,你的工资干嘛呀越高,所以你觉得难受的时候,你应该干嘛呀,你该高兴啊,你该高兴,所以越是不好学的东西才干嘛呀,他越要认真学啊,越要认真学,所以先做好心理准备是吧?哎,所以一定要注意啊,我们前端一学呢,就是一个什么呀,就是一个无底洞,诶你要学东西干嘛呀太多了啊,太多了,所以这里边呢,送给你们一个图是吧?诶所以你选择了做程序员,尤其是干嘛呀前端程序员,我们就要干嘛呀,不断的学习,不断的干嘛呀,吸取知识,像什么呀,像这个老七一样是吧?哎,老七比较省事,他拿了一个葫芦嘎嘎嘎的跟着吸是吧,咱们得干嘛呀,咱们咱们就得做那个葫芦啊,自己去不断的学习,不断的去吸取知识啊,吸取知识好,那这个时候对我们的课程的一个这个简介啊,课程一个简介,我们这里边呢,先停一下。
我来说两句