Elpis:企业级全栈应用框架的实现!

89 阅读4分钟

前言

对于Eplis,可能大家不熟悉,而我在此之前也不了解。作为一名前端,几年来的重复页面开发,其实让人很是头疼。一边想要有所提升,去触达更广;一边又不知道从什么地方入手,困境便在于此。在这个时候,刚好看到哲哥的这个课,如果想要进一步了解,可以搜下【哲玄前端(全栈)】。我在这里就不打广告了,主要想讲下自己对于学到现在的一些想法。

在学习的过程中,其实会和之前的一些工作经历去做对比。之前也会对例如列表页的搜索栏,表格以及一些form表单进行封装,但做完之后,其实会发现有很多考虑不足的地方。例如在组件的内部去做一些api的请求,确实知道这样不太好,但有时为了实际业务的需求,还是硬着头皮写了进去。

而在学习了课程中的里程碑三之后,对组件的封装也会有一些启发,当然也明白这个框架的目的不仅于此。下面我大致讲下对于前三个里程碑的一些理解。

里程碑一和里程碑二

一直以来对于nodejs的认识并不多,在学习之后也疏于应用,导致现在也懵懵懂懂。而里程碑一通过nodejs实现了服务端内核引擎,主要是通过Koa创建实例,再进一步对各个loader进行加载,而在这些loader里面,会对继续app文件下的对应js文件进行解析。

而里程碑二是前端工程化的搭建,这里是基于webpack5。主要想讲的有2点,一个是base文件中,对于打包的一些优化,思路是将js文件分成3种类型进行打包,一者是vendor,指的是第三方库,这些基本不会改动,一者是common,在开发者对业务组件代码的公共部分进行抽取的文件。还有就是业务代码中的差异部分,需要经常改动的。虽然说这样的打包优化并非唯一路径,但还是带来了一定的启发。

此外便是开发环境和生产环境,需要使用不同的打包策略。课程中采用happypack进行多线程构建设置,通过进一步了解知道Thread-loader可能会更好一些,当然这并不影响我们对于生产环境构建的一些思路。而开发环境则采用了webpack的HotModuleReplacementPlugin,用于实现热模块替换,允许在应用程序运行时替换模块,提升开发效率。

里程碑三

接下来说下里程碑三,可能正是因为之前都是在CRUD,所以才感触更深一些。其实跟之前开发最大的区别在于,开发的切入点会有所不同,不再局限于单页面的开发,而是要有整体思维,我觉得不仅是这个框架的实现,即便是现在不使用这个框架进行构建,这种思维适用于每个系统开发。当然疑问的点也存在,就是如果没基于类似这样的框架开发的系统,如何与后端对接。但带着这种思维去开发,终归是好事,接下来大致讲下是如何实现的。

用我浅显的理解讲,便是通过一份js文件,去实现对页面的设计与定义,至于具体的字段我并不想细讲,不然就又变成了看一份文档。大致是将页面的类型分为我们所经常遇见的页面,例如一个搜索栏组件+一个表格组件,这虽然是个简单的页面,但如何通过数据去展现,还是需要花心思的。通过对各种解析器的实现,让我们定义的js文件,能够生成对应的页面。当然也可以通过iframe的方式去嵌套页面,此外还可以完全自定义一个页面。

在学习这个框架的过程中,其实也想起之前工作中使用到的自研低代码项目,说实话确实很难使用,虽然在配置页面的过程中会顺畅些,但是由于业务场景较为复杂,可能存在某个输入框或下拉框的值未反显的情况,而这种问题恰恰是低代码平台自带的问题,无形中加大了工作成本。

而反观课程中的实现逻辑,个人觉得类似的问题,应该完全能够避免,能够真正解决重复性的工作。当然如果能够再进一步了解,如何去使用这个框架,那就更好了,接下来要接着学了,希望尽快学完。