前言:

github日常淘宝,看到的项目可能因为历史原因已经不维护了,跑步起来,那么我们就让他跑起来吧!
本篇以一个古诗词小程序为例,大概花了一天的时间,给想学习的小白或者业余你想整一个玩玩的时候能有个思路。
github链接在文章最下方。

最终实现效果:

1.探索:去github逛街

成功发现一个小可爱 「诗词墨客」:

二话不说,点个star ⭐️ 对作者表示鼓励。

2.运行:一顿操作,给我跑起来

git clone git@github.com:huangjianke/weapp-poem.git
cd weapp-poem
npm install wepy-cli -g
npm install
wepy build --watch

打开微信小程序

导入dist文件夹,我这里已经导入过了。

3. 结果:微信小程序启动!

不出所料失败,一片空白,说好的诗词呢。

哈哈哈哈当然跑步起来了,我们都没有数据~

此处有解答:

古诗词数据存储于 LeanCloud,使用前先在 LeanCloud注册App,然后导入由 chinese-poetry-mysql整理的 mysql 格式数据,并在app.wpy中配置您自己的App相关信息

简单来说我们要:

  1. leancloud(一个提供云服务的厂商)上注册账户
  2. 导入数据到LeanCloud中去。
  3. 配置app.wpy

那接下来我们就一步步来操作。

3.1:注册并创建应用

稍微看下目录结构,长这样:

3.2 导入数据

接下来我们要把数据导入到数据库中。

数据从哪里来,我们照着提示来:

我们去 chinese-poetry-mysql下载sql语句包。
把数据导入到 LeanCloud中去。
很简单的,唯一麻烦的是,我们需要把sql语句转成能上传LeanCloud的csv或者json。

好在我已经处理过了:

把这里的csv文件通通导入进来就行了~

csv文件

问:为啥分成了怎么多份?

因为LeanCloud最大只允许上传30M的文件,所以我手动把他分成几份…
用的蠢办法直接粘贴复制的几十万行…懒的写脚本了

一开始不太明白怎么导入,折腾了下csv的格式。

导入的时候要注意:

  • class名称要一致,poetry开头的csv都是导入到poetry的Class去的。
  • 不要像我一样重复导入…几十m的csv导入估计要几分钟。只有三十几万的诗歌,但我却有50w条数据。

导入完成结果如图:

文档目录结构

3.2 配置 app.wpy

appId,appkey,REST API 照着填下去

3.4 重新运行

嘿嘿,总算有效果了:

摘录:

这里原仓库并没有提供extract表,那咱自己动手,从诗经中随便拿一句出来。

首页:

文集页面:

作者页面:

详情页面:

这样一个基本的诗词小程序就有了,哈哈哈哈给自己点个赞。

4. 改进

  • 这几十万首歌没有搜索明显不行呀,我这辈子都看不完…
  • 数据库中的数据全是繁体,看来要弄个简繁转换。
  • 整个播放诗句语音提高逼格。

4.1 简体繁体转换: 老规矩github上面去淘宝:

发现一个这个https://github.com/toolgood/ToolGood.Words

把这个下载就好了。

直接引入有问题,要在js后面加导出模块函数。

用的时候这样就能用了

import { Translate } from '../../libs/wordsTranslate.min.js';
// 类似这样用
//translate.ToSimplifiedChinese(this.item.author);

4.2搜索:咱们直接来个全文检索:

  1. 这里就随便先建议一个全文索引:作者,标题,内容。

ps:速度有点慢,建立的时候要稍微等一段时间。
真正的简单粗暴,当然这里明显可以改的更好一些哈哈哈。

有了全文索引怎么用呢?去文档捞一捞:全文搜索开发指南 - LeanCloud 文档

好了,学会了,去代码上cv一波。

思路:搜索的时候把输入的简体转化为繁体,在调用api搜索,最后在整合下页面 效果如下:

4.3诗歌的语音播放:

网上找了一个比较好用的接口: http://ovooa.com/API/yuyin/api.php:这个网站超多好用的api 哈哈哈

建议大家可以去看看,挺多好玩的。

主要代码:

大功告成,你已经制作好了一个简单的古诗词小程序~

接下来就是小程序的上架,我们申请好小程序,填写appid和secret上传代码,审核通过后就能上架了。

5. 总结

当然这个小程序还有很多问题,还有很多功能可以完善。

  • 诗词不够全,还缺少了很多诗词…
  • 语音朗读只能说能听…
  • 搜索不够精准,比如按照特定的分类来搜索:作者,标题,内容。
  • 加入用户模块,这样就能喜欢、收藏一些诗词对吧。

这些坑就留着下次填吧。

都看到这里了点个赞不过分吧哈哈哈,谢谢大家~。

有什么不对的地方可以下方留言,我看到会改的!

本偏文章 github链接:

关注公众号:【有点用呢】,做一个有趣又能学习,有点用的公众号。

如何快速开发一个古诗词小程序?相关推荐

  1. 使用云数据库,国庆快速开发一个微信小程序

    国庆七天,如果不想峡谷.王者七日游,就来跟我一起开发个小程序吧,不需要多高的技术,只要你会一点点前端css.html知识,不需要你了解后端语言,更不需要单独部署一个后端服务,十分简单! 之前我写过一个 ...

  2. 微信小程序是什么?如何快速搭建一个微信小程序?

    目录 一.微信小程序是什么 二.安全管理 三.微信小程序的功能 四.快速开发一个微信小程序APP 1.集成即构实时音视频SDK 2.初始化SDK引擎 3.创建房间与登录房间 4.房主创建房间 5.推流 ...

  3. 只需6步,教你从零开发一个签到小程序

    摘要:针对于具备瞬时流量.业务场景比较简单的小程序,开发者借助FunctionGraph,可以方便快捷的搭建一个健壮的小程序后台. 本文分享自华为云社区<智慧校园想搞好,FunctionGrap ...

  4. 一个程序如何连接到外网_如何从头开始开发一个微信小程序

    网上有很多的人在问:怎么开发一个微信小程序?今天我来给大家详细讲讲如何申请开发并部署一个微信小程序,大家看完这篇文章后就能够自己运营一个属于自己的小程序了. 现在的小程序有百度小程序,头条小程序,支付 ...

  5. 开发一个微信小程序,对酒店经营管理有哪些好处?

    据腾讯2022年第一季度财报数据显示,微信小程序日活跃账户已经突破5亿,流量巨大.不论企业用户还是个体商家都积极使用小程序开展商业活动,从这庞大流量里获利. 酒店行业也不例外,很多酒店都开发了微信小程 ...

  6. 真的简单,单手用Spring Boot 开发一个微信小程序

    前言   嗨,大家好,现在微信使用的用户很多,作为开发人员也可以建立一个自己的微信小程序,本期与大家分享一下作者建立微信小程序的开发流程. 申请   百度搜索微信公众号平台,然后扫码登录注册一个微信公 ...

  7. 开发一个微信小程序/APP一般需要多少时间,多少钱?

    开发一个微信小程序/APP一般需要多少时间,多少钱? 微信小程序/APP开发的工期和费用估算需视功能需求的多少和难易程度而定,需求不明的情况下很难给出恰当评估. 在湃点网络定制平台,一对一的专业的顾问 ...

  8. 如何开发一个微信小程序

    如今微信小程序的开发已经成为了一个不可忽视的趋势,不少企业都开始将自己的产品和服务通过微信小程序进行宣传.但是如何开发一个微信小程序大家又了解吗?下面就为大家介绍如何开发一个微信小程序. 首先我们做好 ...

  9. 开发一个商城小程序大概多少费用?

    开发商城小程序的价格,价格从几千到几十万不等,还要看你开发方式.按照类别,价格情况如下: 第一种情况,套模板小程序-价格比较低,一般几千到一万特点是:一般需要按年收费.如果有些功能没办法满足你的需要, ...

最新文章

  1. ios键盘done中文_关于IOS键盘的一些调用心得与坑
  2. webpack - vue Component 从入门到放弃(三)
  3. CodeForces - 632E Thief in a Shop 完全背包
  4. Linux问题分析或解决_ssh无法连接
  5. ubuntu卸载nvidia驱动_解决Ubuntu18.04循环登录问题 - 卸载NVIDIA驱动 启用Nouveau(1)
  6. 网易云音乐:基于分布式图学习PGL的推荐系统优化之路
  7. 算法 --- 插入排序的JS实现
  8. c语言江宝钏实验六答案,C语言程序设计江宝钏著实验六答案
  9. UAS-点评侧用户行为检索系统
  10. cmake打包ICONV库
  11. javascript检测浏览器类型和版本号(兼容各浏览器)
  12. matlab中结构体的定义,matlab中怎么定义结构体啊 !!!
  13. Docker应用容器引擎_简介---Docker工作笔记003
  14. PHPThumb处理图片
  15. php隐藏json数据,PHP调用出json后出来的数目字 想隐藏掉 50份求高手帮忙下
  16. python 正则表达式语法大全_Python正则表达式知识汇总
  17. caj文档如何免费转换成pdf格式
  18. 如何打开计算机控制面板,控制面板怎么打开 快速打开控制面板方法大全-电脑教程...
  19. batch spring 重复执行_Spring Batch_JOB重启机制
  20. python tkinter滚动条不起作用_python – 水平滚动条在Tkinter中不起作用

热门文章

  1. 《Photoshop Lightroom4 经典教程》—第1课1.3节Lightroom的模块
  2. Darknet在ubuntu下的安装
  3. 上海应用技术大学计算机类,2018年上海应用技术大学计算机学院计算机大类考研调剂信息公布...
  4. Laravel - route 的api.php 与 web.php 的区别
  5. 黑色xp苹果系列电脑主题下载、
  6. 工作一年多对于前后端联调些许记录
  7. AP Autosar平台设计 9 诊断
  8. Adaptive AUTOSAR (AP) 平台设计(8)——诊断
  9. 福建省南平市谷歌卫星地图下载
  10. wireguard组建一个内网环境