本文共 4192 字，大约阅读时间需要 13 分钟。

一、前言

1、作为一个专注后台方向上的学习者，肯定不只是简单地处理业务逻辑而已

2、自己独立完成一个作品，一般都要涉及到几个界面的编写：

①登录界面

②CRUD界面

③主页

④…

3、UI方面的简单的框架有很多，使用的过程也是深有感触：

①之前先是使用 EasyUI ，后来逐渐觉得其写出来的界面如明日黄花，简陋不已，写出来的界面都不好意思说是自己写的。

②于是接着选择了最新最热门的基于 Vue2.0 的 ElementUI，为此还特地深入学习了 Vue，后来觉得有点笨重，并且其是侧重于前端工程化的，最好每次都使用 webpack 去开启，作为一个后台的，写好 CRUD、Controller 就已经花费了不少时间了，还把简单的界面处理得那么复杂，总共花费的时间太多成本太高了。

③最后还是回到了 BootStrap，其实很早就接触它了，不过觉得这是新手的玩意，不愿意使用，但是后来觉得开发成本真的极低，且界面淳朴无邪~

④当然中间还有使用了很多 UI 框架，如国内的贤心返璞归真的 LayUI，梁先生的基于 vue 的 iView ；特效框架如基于 CSS3 的 Animate 等等，感觉还行。

二、代码与效果

后面有心情的话，再把其他的界面补上

1、登录界面

① 代码

            
                   
       
                       
   
            
    
                
     
                    
                          
      
                    
      
                    
      
                        
       
                            
                                    
                                    
        
                            
                                    
        
                            
          boss                             
          son                             
        
                            
        
                            
                                
       
                    
      
                
     
            
    
        
   
    

② 效果

2、前端主页

            
                   
           
                                       
           
   
            
    
                
     
                    
                          
      larger5                    
                          
      
                        
                               
       
                            
        
  主页 
                            
        
  写博文 
                            
        
  分类管理 
                            
        
  个人中心 
                        
       
                    
      
                    
                          
      
                        
                               
        搜索                    
      
                
     
            
    
        
   
        
   
            
                
    
                
     
                    
                          
      
                        
       
                            
         最新资讯                        
       
                    
      
                
     
                
     
                    
      
                        
       
                            
         个人中心                        
       
                    
      
                    
      
                        
       
                            
         按类别                        
       
                    
      
                    
      
                        
       
                            
         按日期                        
       
                    
      
                
     
            
    
        
   
    

3、后台 CRUD 界面

            
                   
           
                               
               
   
            
    
                
     
                    
                      
     
            
    
            
    
                
     
                    
      
                        
                               
                                   系统菜单                                                
       管理一                        
       管理二                        
       管理三                        
       管理四                        
       退出                    
      
                
     
                
     
                    
      
                        
       
                            
        
  主页 
                            
        
                        
       
                    
      
                    
      
                        
       
后台管理系统
                    
      
                
     
            
    
            
    
                
     
                    
      
                               Copyright © 2017-2018 larger5                    
      
                
     
            
    
        
   
    

效果：

4、…

（有心情再写~）

三、小结

1、做后台做烦了，可以试着去写点前端的东西，前端专注与视觉的建设，能让你带愉悦的心情重返后台的工作~

2、

转载地址：https://larger5.blog.csdn.net/article/details/79383621 如侵犯您的版权，请留言回复原文章的地址，我们会给您删除此文章，给您带来不便请您谅解！