V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
macid
V2EX  ›  Vue.js

想借由开发一个简单的 web app 来熟悉 Vue,不知道从何处入手,望老手不吝赐教

  •  
  •   macid · 2022-05-02 16:03:02 +08:00 · 3096 次点击
    这是一个创建于 696 天前的主题,其中的信息可能已经有所发展或是发生改变。

    刚开始接触 web app 的开发,手头上刚好有一个管理系统的后台。该后台已经提供了一套 XML API 。

    我的需求是开发一个 web app 。这个 app 通过与管理系统后台的数据交换,可以实现:向用户展示一组“控件”(控件所需要展示的信息来源于对后台的 POST 请求);用户与控件进行交互,把更新的状态信息又反馈给后台(依旧是通过 POST 请求)。

    我的问题是,这个 web app 完全用 Vue 就可以实现了吗?还需要涉及 backend 的开发吗?前端页面按说也需要有自己的状态信息需要管理吧。最近刚开始接触 Vue ,了解到 reactivity 的概念,感觉似乎很对路:通过页面操纵数据,数据的变化又能立即在页面上反映出来。

    初次接触 web app 开发,手边资料很丰富,但不知道从何处入手,希望经验丰富者指点一下努力的方向,多谢!

    12 条回复    2022-05-04 11:28:03 +08:00
    zcf0508
        1
    zcf0508  
       2022-05-02 17:00:27 +08:00   ❤️ 1
    可以先看 vue 的官方文档,还是比较好入门的。

    我个人推荐先考虑你的页面设计,看下后端提供的接口是否满足你的使用,因为页面数据展示和后端提供的数据可以有出入。有了页面设计之后可以先实现页面的设计,用 html 和 css 或者直接用现成的 UI 框架,把界面搭起来,然后再利用 vue 来控制页面数据的展示。

    可以去找个 github 搜关键字 vue admin 之类的看看项目。
    vacker
        2
    vacker  
       2022-05-02 17:33:08 +08:00 via Android   ❤️ 1
    刚开源了一个 vue 做的项目 https://www.v2ex.com/t/850391 希望对你有帮助
    SuperMild
        3
    SuperMild  
       2022-05-02 17:56:18 +08:00
    > 这个 app 通过与管理系统后台的数据交换

    这个管理系统后台是已经有了吗,它提供 http api 吗?
    macid
        4
    macid  
    OP
       2022-05-02 18:32:55 +08:00
    @SuperMild 本身这套系统自带有完整的后台和前端。然后,也提供了 http api 。对它的所有的查询或操作都能通过 api 完成。我现在要做的,是按照自己的操作习惯,利用 api 重新设计一个前端。但我有点不太明白的是,我打算开发的这个 web app ,应该还是得有自己的后端吧。因为按照我的理解,这里面可能涉及到跨域( web app 可能和系统没法部署在一台主机上,而且,系统我也没办法更改),前端页面上的 js 可能没法直接发出 http 请求。
    macid
        5
    macid  
    OP
       2022-05-02 18:35:27 +08:00
    @zcf0508 非常感谢。正在了解 vue-admin-template ,还有 Arco Design Vue ,Naive UI 。
    narmgalaxy
        6
    narmgalaxy  
       2022-05-02 20:36:19 +08:00   ❤️ 1
    先做一个 todo 应用吧.这个用来入门是挺好的
    skys215
        7
    skys215  
       2022-05-02 22:20:43 +08:00   ❤️ 3
    dayeye2006199
        8
    dayeye2006199  
       2022-05-03 01:27:08 +08:00
    @macid 如果你已经有现成的 API 后端,你的前端 app 就是纯 JS 。通过 JS 向后端发出各种 HTTP 请求,完成各种操作。收到的数据,用 JS 渲染成 HTML 。

    跨域配置完全可以在后端完成,你只要在已有的后端里面配置允许你的新前端部署的 URL 访问就可以了。

    我猜 LZ 应该是有不少使用模板引擎做 web 的经验。前后端不分离就是后端在服务器端直接返回 HTML 给用户;前后端分离就是后端只负责接受和返回数据给前端,前端收到数据之后只负责展示成 HTML 和发送进一步的请求给后端。
    RedBeanIce
        9
    RedBeanIce  
       2022-05-03 01:34:44 +08:00
    写 vue 前,我真的建议先学一下 javascript 或者 typescript ,花费时间大概在一周(假设你是有编程基础的情况下)

    如果上来就写 vue ,你会看不明白的。
    tedding
        10
    tedding  
       2022-05-03 19:39:55 +08:00 via iPhone
    9#说得很中肯 …… 以及 我更推荐你去用 angular 而不是其他两个
    matthewzhong
        11
    matthewzhong  
       2022-05-04 09:02:28 +08:00
    以前有个师兄教我,不管学什么都可以从做一个博客开始。你可以用 vue+markdown 写一个博客程序
    yoghurtoreo
        12
    yoghurtoreo  
       2022-05-04 11:28:03 +08:00
    一个基于 Vue3 & Vite2 & Vuetify 3-Beta & Lean Cloud 的记账类练手小玩具,大佬可以来看看: https://github.com/boring-plans/boring-days
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   我们的愿景   ·   实用小工具   ·   4551 人在线   最高记录 6543   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 26ms · UTC 05:34 · PVG 13:34 · LAX 22:34 · JFK 01:34
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.