关于上学期前端开发的总结

2021/7/27 6:07:32

本文主要是介绍关于上学期前端开发的总结,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!

  不知不觉马上就要到了第四年了,回眼望去发现自己真的时浪费了太多时间了,如果早点开始学习编程  我现在应该也会牛批哄哄吧!嘿嘿

 

上学期突然对前端感兴趣是因为考虑了多方面因素

首先呢,我的专业是计算机科学与技术,所学专业大部份都与网页开发有关,加上在学校的初略学习使我具备了一定的基础  再学习起来也会轻松很多

其次,其实我之前考虑过要深入追求我所热爱的东西的 并将其当作我未来所要从事的工作,但热爱归热爱,在前进的途中发现很多问题,比如我到时候找工作很难证明我在这方面做的很好,也没有找到

     什么可以相互交流的人等等,于是我满满开始面对现实,当一个勤勤恳恳的it民工吧还是

还有呢就是之前刷小视频有刷到一些前端开发的博主 通过他们的介绍我对于前后端的认识以及各种技术与开发工具有了一定的认识,并且也大概知道了学习路线 ,同时我还了解到程序员貌似还是非常吃香的

     的哈哈哈,有了明确的方向我就给自己制定了计划,计算机相关的证件要考,四六级也一定要过,然后平时呢就将自己闲暇时间用于去制作一些项目然后在未来面试时证明自己;

 

  **********************************************************************************************************************

首先说一下对前端与后端的认识吧

一、前端

        也有人把客户端叫做前端的,前端主要就是负责一个网页的结构,样式,和一些功能(行为);只有结构和样式的网页我们把他叫做静态网页,在加入了行为,也就是javascript后,使网页与用户具有了交互的功能后我们把他叫做动态的网页;

        浏览器是一切网页的载体,在你有了浏览器后才可以访问网页;用户自己制作的静态网页是可以不访问服务器就运行在浏览器中的;

        前端的三大核心技术就是(html+css+javascript),其中js在这三个中内容最多也最难学,一旦你精通了js你就是半个程序员了,其中css之后还有css3,5这都是新标准,添加了很多样式,还有一个专门的css库bootstra,必须要知道如何使用,再学会了原生的js后要去学习js的库jquery,还有具有通信功能的ajax(用于与后端进行交互);之后呢就是对于比较流行的框架的学习了,有vue和recat等等;这学期主要学习了vue,一会在下面会总结一下对vue的认识与经验;

        前端的开发工具呢主要按需区分使用,客户端的一般使用vscode就行,功能非常强大,内置各种插件,是一个专门用于开发前端的工具,也可以使用hbuilder;dreamwear并不是很推荐;

   二、后端

         我对于web开发呢主要是以学习前端为主呢,但后端也多少了解一些;也有将后端称为服务器端的,应为后端的开发都是要配合服务器完成的,什么可以叫得上后端呢?

         所谓后端技术就是用于完成web网页中与数据库进行交互的技术,前端是不涉及与数据库的交互的,前端可以建立json文件用于存取少量数据,但一个网页庞大的数据都还是由数据库提供的,后端程序员呢就负责创建各种实例与他们的行为,编写后台的各种方法,还有建立与数据库的连接,之后将方法以接口的形式交给前端程序员,前端程序员要做的就是完成页面的布局以及使用后端程序员提供的接口完成页面所具有的功能,使页面显示各种情况下应该显示的数据,而网页本身的那些点击实际对话框什么的都是由前端人员完成的;

  前端引用后端端口的方法:https://zhidao.baidu.com/question/1804165703374983067.html

         总而言之区别前后端就是 :前端你的数据都是要在后端获取的,还有方法(添加,删除这些)也是后端提供给你的,前端要做的就是把页面布局(html+css+js)做好并且使用后端人员提供给你的东西

          后端开发技术我所知道的有:asp.net,服务器使IIS;最底层框架是.net;MVC也是一个后端开发的框架,使用的语言是c#;要学asp。net就先学c#面向对象然后安装vsudio(自带IIS服务器)学习

                                                         jsp.net,服务器使用的使apache tomcat,使用java语言开发的网页就是jsp;要学jsp就先学好java和java的面向对象,然后安装jsp的开发环境和服务器开始学习

                                                         php.net也是后端技术,这个很容易学习,但是不是市面上流行的,不推荐

   三、客户端与服务器\前端与后端

           用户每天上网获取网页浏览网页其实就是客户端与服务器端交互的结果,他们之间是通过http协议进行通信的,+s代表安全传输,过程如下:

             用户在自己电脑(客户端)的浏览器地址栏输入目的网站的网址,网址有几部分组成需要了解,此时浏览器请求DNS服务器解析这个域名(网址),解析到目的主机(服务端)的ip地址后将服务器端口80打开,然后服务端响应客户端的请求并返回相应的页面,此时用户的浏览器上就显示了相应的页面;                                              \\套接字(ip+端口)

            服务器的右边(左边是客户端)通过使用ftp协议将网页上传到服务器上(服务器就是一台高性能的计算机),用户获取到的就是开发人员上传到服务器上的网页;

            浏览器常见的一些错误页面中4开头的是客户端本身的问题,5开头的服务器的问题(可能是你访问的网址的服务器网页都被删掉了)

 

接下来就是我对上学期前端学习的总结:

一、 在写结构时先好好考虑用哪些标签可以减少代码量

        html最重要的就是把盒子模型练好,配合浮动,绝对,相对定位或者是弹性布局flex,还有页边距完成网页里容器的位置拜访

       然后就是认识到哪些是行内元素,哪些是块级元素,块级元素和行内元素可以通过display相互转换:block\inline

        打包:将网络上一个库通过link标签打包引用到你的页面呢,bootstrap的使用就是通过打包完成的;还有最后前后端共同完成网站的开发后的打包工程;

              https://blog.csdn.net/qq_42019025/article/details/80344362;配置好应用信息后将其发行,打包为安装包\如果是网页的话就通过ftp传到相应服务器上

        封装:将一系列方法(可能会被反复使用的动作)写成一个函数,要用的时候就调用(其实就像c语言用户输入不同数字通过加法函数完成相加返回结果那样,很好理解)

       快捷键:shift+!;html基本结构           shift+/注释掉改行         shift+enter行内容中换行        双击可以选中一个词              ctrl+f查找(选中一个词按ctrl+f)  还有html标签的语法输入要学习(ul>li*6)

       html引用图片时网址首部的含义:./表示当前路径

          图像文件和HTML文件位于同一文件夹:只需输入图像文件的名称即可,如。

          图像文件位于HTML文件的下一级文件夹:输入文件夹名和文件名,之间用“/”隔开,如。

          图像文件位于HTML文件的上一级文件夹:在文件名之前加入“../” ,如果是上两级,则需要使用 “../ ../”,以此类推

        安装vscode时要安装中文插件,自动保存插件,网页自动刷新插件

          写html的习惯最好是先写结构再写css,如果有的css是公用的就加入到项目的css文件中,一般不要写行内样式,写页内样式;

二  、css

     第一步要:*{margin:0;padding:0}用于取消网页默认的间距

      写css首先页面大小:px\inch\em或者百分比:子元素继承父元素的尺寸时需要为父元素指定长宽,还必须时块级的;

        嵌套盒子写定位时一般父元素时相对定位,子元素是绝对定位

        当出现继承的问题时使用overflow去取消继承          overflow功能丰富,不仅可以取消继承还可以使文本隐藏显示

        圆角border-raduis/阴影shadow\opcity:透明度\rgba最好一个数字是透明°\在样式前+!important最高优先级\Z-INDEX样式优先级排序\

       样式选择器:以下代码的功能是为p标签下第二个子元素设置样式

      p:nth-child(2)

{
background:#ff0000;
}
   伪元素
       a::before/a::affter {content:“内容”; color:red;}  在所指定的标签前或者后插入一个元素并为他设置样式
   ************居中的设置***************
  垂直剧中只需要设置文本的行高line-height和容器的高度一样就行,容器居中:margin:0 auto;0:上下  auto:左右       ps:margin\padding中的四个数字是:上右下左;


三、js
   原生的js主要要知道(捕捉页面的参数、监视dom的动作并触发行为的代码(函数)、选取页面中的元素、对数组和对象的各种操作、)
      其他的写法循环,判断都和c的写法很像




四、VUE的学习
      首先就是vue环境的搭建了,以使用vscode为例:需要安装node.JS+Git+vscode这三剑客
      分别在各自的官方下载就行了    
       然后需要注册git的账户,在vscode中会使用npm的行命令与git clone网洛中的优秀资源
      在三个都下载以后需要在vscode中通过npm命令安装一些依赖mo...开头那个文件夹中存放的都是项目所需的依赖
       在创建完成项目后使用npm i初始化项目然后npm run dev运行程序




   首先知道VUE是一个什么,VUE是一个前端的框架,一个个页面文件是以vue为后缀名的文件,创建好工程后放在src中,他将一个拥有若干组件的页面拆分成若干个小组件,每一部分一个文件夹存放这些组件,所谓的组件也就是网页中
那一块的代码,这可以称作为模块化,有了它再配合使用git就可以实现多人合作完成开发这一个web项目
 
   客户端开发使用vue有一个专门的组件库element-ui,在导入并安装了相应的依赖后就可以直接使用现成的具有华丽样式的组件(多采用复制粘贴然后改局部)
    一个vue的结构大概就是template标签标识结构的开始与结束;
  *********** 在头组件中引入子组件********
script标签外使用import导入书写完成的子组件与写好的接口;script内有以下几部分
(data()
{return
{在其中定义数据}
};
props:{};
component:{};
 mounted: {
其中的操作行为都是页面加载完成前进行的
};
methods:{
页面中的方法,行为
使用后端的接口并返回数据给组件中定义的数组也在其中完成,具体步骤要仔细学习ajax
);
watch:{
}
 子组件穿数据给父元素
  父组件传数据给子组件
  同级组件传数据
  this.&router.push路由传参 (params,query)\ 目的页面接受参数
  最重要的是 万物兼对象:路由是一个对象,在index.JS\router.js中    
   this.$router.push中也是一个对象,有目的页面和要传的参数
 vuex下的status,action,

  







 

            



这篇关于关于上学期前端开发的总结的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!


扫一扫关注最新编程教程