如何实现项目上的快速开发

简介: 如何实现项目上的快速开发(前端为主)1.熟悉电脑的组合键操作和性能2.熟悉编辑器的组合键操作3.良好的项目结构和面向对象(数据抽象和数据封装)

如何实现项目上的快速开发

  本篇文章主要是展示一些提高开发效率的方法,以前端为主,对后端开发也有一定的参考价值。
  工欲善其事必先利其器,对于程序员的工作而言,电脑和编辑器就是工具,了解清楚其性能非常重要。下面就来介绍如何打造一件趁手的工具

熟悉电脑的组合键操作和性能

下面是几个常用且重要的快捷操作

1.alt+tab(mac系统下是❀+tab),连按tab用于快速切换当前窗口,在没有第二屏幕的时候非常实用。当然,如果有条件的话外接一个屏幕效果会更好
image.png
2.ctrl+c,ctrl+v(mac系统下是❀+c,❀+v),程序员必备SSS级技能,复制粘贴。可能是用的最多的快捷键。

3.ctrl+z,ctrl+y(mac系统下是❀+z,❀+y),系统的前进后退按钮,不仅写代码改代码的时候非常实用,而且误删文件的时候在文件资源管理器也可以使用。

4.window下的一键返回桌面按钮,在开了一堆窗口的时候一键最小化,还你清晰的思路。
image.png

5.rmdir /s/q [文件夹路径],在window下,删除大量的文件,系统还要做大量的校验工作,可能删一个node_modules文件夹需要几十分钟,非常缓慢。在CMD下直接运行次命令能快速删除文件,适合前端删除依赖,但要注意要用管理员身份运行,并且删除后无法回复。

image.png

熟悉编辑器的组合键操作

以vscode为例子
1.在设置里打开自动保存,省去ctrl+s的操作,防止电脑突然断电
image.png

2.shift+alt+f,快速格式化当前文件,对理清代码结构非常有帮助

image.png

3.ctrl+shift+d,行或者选中的内容直接向下复制,比ctrl+c,ctrl+v效率更高,继承自Sublime的快捷键,使用前需要去配置看看有没有冲突

image.png

4.使用Settings Sync插件,一键同步你的VSCODE配置到github帐户上,在切换个人电脑,公司电脑,阿里电脑的时候非常方便,同步一下就把编辑器配置配好了!

image.png

5.使用主题我推荐的是image.png怎么好像绝版了,One Dark Pro也是一个不错的选择,颜色非常的鲜艳,能清楚的区分JS的数据类型,同时也让使用者心情愉悦。
image.png

良好的项目结构和面向对象

良好的项目结构,合理的封装不仅仅是代码变得更加合理易懂,还能大大减小修改和维护的工作量

无论是函数的抽象还是类的封装,建议在有两个或以上的地方复用的时候进行,盲目的抽象和封装会造成阅读困难,缺少抽象和封装会造成代码冗余,两者都会造成代码维护困难

1.前端项目结构,以下是一个示例,展示在umi框架下复用的组件和工具函数是怎么跟页面抽离出来的。
image.png

2.减少或者不使用modal进行传参和状态管理,使用umi久了就会陷入一个误区,觉得使用modal传参很爽,很方便。但大量使用modal会造成代码盘根错节,耦合度降低。在做了一段时间原始的微应用框架的业务后,我觉得modal是完全没必要在单独页面使用的一个东西。在用户信息等全局的场景使用才是更合理的用法。
原生的fetch或者单独的servers文件能替代它的网络请求功能,state能替代其状态管理功能,props,createContext和url能代替他的传参功能,所以,为什么要用modal呢?

3.正确看待ESlint,在养成良好的写代码习惯之前,把ESlint校验打开是利大于弊的。但是同时也应该知道,它帮助你屏蔽掉了一些会造成变量提升之类的写法,如果失去了ESlint,应该特别注意JS代码结构不正确造成的报错。

相关文章
|
7月前
|
前端开发 JavaScript jenkins
构建高效前端项目:从模块化到自动化
【2月更文挑战第13天】 随着Web技术的不断进步,前端项目的复杂性日益增加。为了确保可维护性和性能,前端工程师必须采用模块化和自动化的策略来优化开发流程。本文将探讨如何使用现代前端工具和最佳实践来构建一个高效的前端项目架构,包括模块打包、代码分割和持续集成等方面。
|
7月前
|
JavaScript 前端开发 API
构建高效前端技术栈
构建高效前端技术栈
99 0
|
2月前
|
Java API 数据库
Spring Boot框架因其简洁的配置、快速的启动特性及丰富的功能集而备受开发者青睐
本文通过在线图书管理系统案例,详细介绍如何使用Spring Boot构建RESTful API。从项目基础环境搭建、实体类与数据访问层定义,到业务逻辑实现和控制器编写,逐步展示了Spring Boot的简洁配置和强大功能。最后,通过Postman测试API,并介绍了如何添加安全性和异常处理,确保API的稳定性和安全性。
42 0
|
4月前
|
前端开发
项目中如何使用组件化
【8月更文挑战第13天】项目中如何使用组件化
49 2
|
5月前
|
开发框架 前端开发 关系型数据库
使用代码生成工具快速开发ABP框架项目
使用代码生成工具快速开发ABP框架项目
|
5月前
|
前端开发 JavaScript 安全
前端技术栈都有那些,需要学会啥才可以上手写项目?
【7月更文挑战第9天】 前端技术栈包括HTML/CSS/JS基础,熟悉Vue.js/React/Angular等框架,掌握Git、Webpack等工具,理解HTTP协议及安全概念。使用Node.js和编辑器提升效率,从基础到框架层层深入,实践项目以巩固知识,持续学习应对技术更新。
158 0
|
7月前
|
前端开发 JavaScript 测试技术
构建高效前端项目:模块化与组件化策略
【2月更文挑战第25天】 在现代网页开发中,随着用户对于网页性能和交互体验的期待不断提升,前端项目的复杂性也随之增加。为了应对这种复杂性并提高开发效率,本文将探讨模块化与组件化在前端项目中的应用策略。通过分析这两种方法的优势与适用场景,我们将揭示如何利用它们来优化项目结构,提升代码复用率,以及加快开发流程。
155 4
|
7月前
|
Java 应用服务中间件 Maven
简化springboot部署,太灵活方便了!
简化springboot部署,太灵活方便了!
|
7月前
|
资源调度 前端开发 JavaScript
构建高效前端项目:模块化与组件化的最佳实践
【2月更文挑战第13天】在现代前端开发的浪潮中,模块化和组件化已经成为提升项目可维护性和开发效率的核心原则。本文深入探讨了如何通过合理的模块划分、组件设计以及工具选择来优化前端项目结构,同时确保代码的复用性和可测试性。我们将从理论出发,结合实例分析,为前端开发者提供一套行之有效的最佳实践指南。
329 0
|
前端开发
前端学习案例2-模块化2
前端学习案例2-模块化2
57 0
前端学习案例2-模块化2