前端入门的一些知识

前端入门好用的一些工具

1 . flexible.js：一种方便的布局方法

flexible.js是手淘开发出的一个用来适配移动端的js框架。手淘框架的核心原理就是根据制不同的width给网页中html根节点设置不同的font-size，然后所有的px都用rem来代替，这样就实现了不同大小的屏幕都适应相同的样式了。其实它就是一个终端设备适配的解决方案，也就是说它可以让你在不同的终端设备中实现页面适配。

一种非常好用的响应式布局方法，可以将前端页面划分成很多块，并且按照比例进行盒子布局，非常的方便。

2.VUE前端框架

Vue.js致力于构建数据驱动的web应用开发框架，以简洁化，轻量级，数据驱动，模块友好等优势深受企业以及前端开发者的喜爱，成为前端开发人员必备的技能。Vue3.0的出现，又带动周边生态的发展，奠定了vue在企业级开发的重要地位。

这东西开发起来，让我感觉前端有了一种写代码的感觉，以前就觉得HTML就像是写记事本一样，现在就好像是真正的开发“程序”。当然我也是门外汉，做过一两个项目，不是主搞这个，也是现学现卖。做一个扫盲。

开发起来感觉很友好。

3.electron

其实在 Electron 出现之前，如果你问我做桌面应用需要什么，我的第一个想法是 C、C++、C#、Java 以及微软的 Visual Basic 等等语言（Sorry 我不是个苹果党，第一时间想不起 Object-C），外加体积巨大的 IDE（比如我到今天依然不喜欢的 Visual Studio 和曾经为了玩 Minecraft Mod 开发装的 Eclipse 等等），当然也还有各种编辑器 + 编译器的组合，比如 Notepad++ 和 GCC……

对于 Electron 项目的了解，还是导师让我做电子数据可视化大屏，但是由于嫌弃我做网页，用html+css+js实现，但是我想如果用QT开发这种，怕是吃力不讨好，后来一次偶然在一个论坛，看到别人聊到了Electron，我就了解了一下，还发现 Visual Studio Code这个东东居然用的是 TypeScript + Electron 开发出来的，而 TypeScript 其实就是 JavaScript 的超集……这个冲击了我的世界观，要知道直接使用 JavaScript 开发桌面应用以前不是没有过，但是能够提供像是 VS Code 这么好用且顺滑的感觉，在之前是不敢想象的，甚至为了一个小小的工具，我都要在 VS 里面先做窗口界面，然后用 C# 在那里搞来搞去，可能是对桌面端应用的不熟悉，我做这种工具总是没有很顺手的感觉（对，这方面我的确很渣）；而 Electron 的出现，让我有了可以使用自己熟悉的语言以及简单的编辑工具，就可以做出一个小桌面应用的希望。

现在C/S和B/S架构已经变得模糊了，B/S架构不一定是部署在网页上，electron可以让你的网页架构部署成桌面应用。

4.立即执行函数

为了防止变量污染，减少命名冲突，我们可以采取立即执行函数的写法。因为里面的变量都是局部变量。

//注释
(function()){
    
}）

这种写法，在自己创建的index.js中，可以隔绝不同的js脚本，很方便。

5.Flask与VUE冲突

Flask是python的后端框架，他们在前端变量命名中存在冲突。针对这个问题解决如下

Flask与vue的大括号冲突问题

flask

app = Flask(__name__, template_folder="templates")

# 因为vue和render_template的模板都是用{{  }}，所以会冲突，将flask的修改为[[  ]]
app.jinja_env.variable_start_string = '[['
app.jinja_env.variable_end_string = ']]'

vue

// 1.x
Vue.config.delimiters = ['{[', ']}']
 
// 2.x
new Vue({
  delimiters: ['{[', ']}']
})

都是之前总结的一些稀碎的知识，将就着看看吧，有缘人。