由土木转向计算机之后的第一个项目终于完成了，这是一个偏土木工程方向的软件，采用Electron+WebGL+Flask，实现了结构模型的建模、修改、材料与截面属性赋予、模型信息存储等功能。从2020年7月开始开发到2021年2月，虽然说并没有实现太多的分析功能，但是兼顾了前端与后端的开发，使我一个计算机小白对编程与开发有了更加深刻的了解。接下来按着开发的时间路线做一个简单的回顾与总结。
各个文件的用途：
GUI： GUI包括前端的所有文件。 main.html:包括了3D编辑器与下面的前端界面。center.html是子窗口，用于创建3D编辑器。而前端界面写在父页面上。 center.html:引进3D编辑器。 Axis.js：坐标轴 MSASect：其中的一个模块的功能实现与窗口。 Geometry1：主要负责接受父页面的点击，然后再子页面上渲染。里面含有了各种数据结构与主要数据（节点，杆件，Section等）。 Editor里面是Three.js的各种文件，用于引入编辑器。 js里面是各种外部js。 Core里面装的是计算的理论，是python编写的，其中引用了flask实现了数据的交互。
MainUI.js：主进程，electron执行的时候会调用主进程。实现了窗口、菜单的 创建等
iniMenu.js:渲染进程。
开发流程：
第一个步骤就是把Three.js Editor引入软件形成3D界面。由于是第一次引入外部文件，所以主要卡在了文件的引入上，学会了使用Git从github上获取资源，并且对node.js有了简单的认知，即若要实现某个功能，就要安装相应的包，如一开始开在signals上卡了很久（require或者not defined的问题），通过引入npm install signals即可。引入编辑器后，学习了在Threejs中如何实现图像不随视角和缩放而变化（其实就是通过记录放大的倍数对图像进行缩放而已）与创建渲染图像。
该软件使用Electron进行开发，一开始并不清楚Electron有什么用，后来随着开发的深入才意识到什么是一个前端框架。利用Electron的功能，针对性地学习了主次进程、ipcRenderer等各种模块，方便进行开发。当然在最后还学会了Electron的打包方式，我使用的是packager，总体而言还是很方便的，不过还有一个问题就是打包的时候一些外部文件会被忽略，所以会导致一些错误（如python无法调用等，解决这个问题可以使用build或者将文件转化为可执行程序）
刚开始写界面的时候就是一个劲的手动写，效率很低，后来慢慢才意识到可以使用各种库帮助我们快捷地实现功能（Vuetify Bootstrap等）。这一步其实是最没有技术含量的一步。
刚开始学习的时候觉得js内容很少，不难，真正开发的时候才发现js才是最关键和重要的部分，软件任何功能都是通过js实现的。在这个过程学会了js的基本操作，如何通过用户的操作去实现一个功能，如何实现元素之间的数据交互，如何实现动态的变化等。 在该软件中需要存储各种数据与集合体，如果分开进行组织会十分麻烦。所以在js中使用了class的方法对节点与杆件进行了表示，任何操作都可以通过简单的set和get进行表示。
通过Ajax与Flask实现了前后端的交互。期间遇到了许多的bug，一般都是internet或者server的错误，但是都是因为交互的数据的格式不对引起的，所以要千万注意ajax里面dataType的设置，最好不用设置。