记录开发一个英语听力训练网站

背景

在当前全球经济衰退的背景下,IT相关的工作在国内的竞争也是越来越激烈,为了能够获得更多的可能性,英语的学习也许能为程序员打开一扇新的窗户,比如很多远程的工作尤其是国际化背景的工作团队,英语的协作沟通是必不可少的。事实上,我们大多数人从小到大一直都在学习英语,虽然可能在工作中用到的场景并不多,但是多多少少还是有一些英语底子的,比如一些基本的词汇量、语法知识等。但是听力和口语确确实实用到的不多,自然而然也就是听说读写中最为薄弱的两项。为了更好的练习英语听力,我花了两周的时间开发了一个适合精听的网站。作为阶段性总结,想要将用到的技术在这里做一个梳理和分享。

主要技术

前端

HTML、CSS、jQuery、JavaScript、Bootstrap

因为项目比较小,没有采用前后端分离的架构,用的是比较轻量级的框架Bootstrap,然后结合简单的jQuery、JavaScript实现。

后端

Java、SpringBoot、Maven

后端使用比较普遍的SpringBoot结合Maven快速搭建主体框架,事实上后端也相当的“轻量”,因为事实上只是一个学习工具网站,比较简单,也没有做用户体系登录什么的,所以后端其实没什么代码。

对象存储

阿里云OSS

听力音频文件和字幕文件是放在OSS服务器上。

音频转字幕实现

CMUSphinx、Vosk、Buzz

CMUSphinx和Vosk是接入程序代码实现,CMUSphinx体验下来识别率不高,比较旧。
Vosk识别率还可以,英文的模型有简单的、占用内存少的和更完整的、占用内存多的两种,采样率可能需要做一些调整根据不同的文件。Buzz是一款电脑上运行的软件,识别率最高,其中一个模型是OpenAI的Whisper,过程也非常耗时,支持导出字幕。
相关资料:
- https://cmusphinx.github.io/wiki/tutorialsphinx4
- https://alphacephei.com/vosk/server
- https://github.com/chidiwilliams/buzz

字幕编辑工具

Aegisub

Aegisub也是一款本地运行的软件,用来后期编辑字幕,需要导入srt格式的字幕文件。相关资料:https://aegisub.org/downloads

网站介绍

目前只导入了雅思历年真题的听力音频,作为我日常练习英语听力的素材足够了。网站的主要功能其实就是英语句子精听,核心目的就是反复听每一句话,直到听懂为止,我觉得听力训练也没有太多技巧可言,就是老老实实地坚持去听,所谓网上经常说的“磨耳朵”吧。基于此,听力页面主要功能有:播放/暂停、上一句/下一句、播放次数选择、播放倍速选择、字体大小选择、是否显示原文、是否显示译文、是否自动播放下一句。而这些功能,基本上都是页面js操作。
在这里插入图片描述

结束

目前刚刚开发完成上线,我自己正在试用阶段,如果你对这个网站感兴趣,请给我留言,或者发邮件到smartwork.no996@gmail.com,参与内测试用。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.xdnf.cn/news/1534935.html

如若内容造成侵权/违法违规/事实不符,请联系一条长河网进行投诉反馈,一经查实,立即删除!

相关文章

pdf怎么加页码?5种pdf添加页码指南分享,快来领取!

如何在一个包含大量页面的大型pdf文件中快速找到特定的页面或信息呢?最简便的方法就是为pdf添加页码。pdf添加页码能够清晰显示页面顺序,帮助读者轻松浏览大型pdf文档,同时也便于寻找特定章节和确定整体长度。然而,并非所有pdf文件…

【LeetCode】每日一题 2024_9_14 从字符串中移除星号(模拟)

前言 每天和你一起刷 LeetCode 每日一题~ LeetCode 启动! 今天的题目曾经的我做过了 . . . 又是复习的一天 题目:从字符串中移除星号 代码与解题思路 func removeStars(s string) string {// 本题的核心:生成的输入保证总是可以执行题面中…

【大数据】MapReduce的“内存增强版”——Spark

【大数据】MapReduce的“内存增强版”——Spark 文章脉络 Spark架构 Spark-core SparkConf 和 SparkContext RDD Spark集群 Spark-sql 在大数据时代,数据处理和分析成为企业竞争的重要手段。Hadoop作为大数据处理的基石,其核心组件MapReduce在众多…

完结马哥教育SRE课程--就业篇

文章目录 一、Linux基础入门1.Linux基本架构2.什么是shell3.执行命令4.Shell中的两类命令5.常见命令6.输出信息echo7.tab键补全8.获取帮助 二、文件管理和IO重定向1.文件系统目录结构2.文件系统目录功能3.linux下的文件类型4.文件操作命令5.文件状态stat6.确定文件内容7.文件通…

如何搭建一个自己的外卖会员卡系统?

大家好,我是鲸天科技千千,大家都知道我是做小程序开发的,平时会给大家分享一些互联网相关的创业项目,感兴趣的可以跟我关注一下。 搭建一个首先就是要搭建一个自己的返利小程序也就是外卖会员卡小程序,然后客户在我们…

锁表导致系统挂了,谨慎DDL操作

作者:IT邦德 中国DBA联盟(ACDU)成员,10余年DBA工作经验, Oracle、PostgreSQL ACE CSDN博客专家及B站知名UP主,全网粉丝10万 擅长主流Oracle、MySQL、PG、 高斯及Greenplum备份恢复, 安装迁移,性能优化、故障…

【Ubuntu】Ubuntu双网卡配置 实现内外网互不影响同时可用

【Ubuntu】Ubuntu双网卡配置 实现内外网互不影响同时可用 建议前提配置用到的命令参考文献: 建议 本文仅作个人记录,请勿完全照搬,建议直接看此视频,按作者的步骤进行配置 linux配置内外网(ubuntu举例)&am…

看Threejs好玩示例,学习创新与技术(二)

本文接上篇内容,继续挖掘应用ThreeJS的一些创新算法。 本文理解难度比较大,可以先看一些概念,在难的地方培养一些意识即可。 1、扭曲的自然 下面图本身是矩形的,为何它可以这么扭曲呢?它在随机处带有一定的规律&…

跨平台开发新视角:利用Android WebView实现Web内容的原生体验

在移动应用开发领域,跨平台解决方案一直是一个热门话题。开发者们不断寻求能够同时在iOS和Android平台上提供一致用户体验的方法。而Android的WebView组件,作为一个强大的工具,允许开发者在Android应用中嵌入Web内容,为用户提供接…

jmeter吞吐量控制器

一、吞吐量控制器作用:旨在混合场景中,控制样本数,通常在比例场景中使用 吞吐量控制器提供了两种控制模式: 百分比执行(Percent Executions): 吞吐量控制器会根据配置的百分比来决定其下的作用…

模拟实现vector:vector构造、析构函数、size、capacity、push_back函数、迭代器、[]运算符重载等的介绍

文章目录 前言一、vecotr构造、析构函数、size、capacity、push_back函数、迭代器、[]运算符重载二、insert函数三、const修饰的迭代器总结 前言 模拟实现vector:vector构造、析构函数、size、capacity、push_back函数、迭代器、[]运算符重载等的介绍 一、vecotr构造、析构函数…

拥塞控制算法为何失效,网络为何难以测量?

紧接着上文 如何测量一个(传输网络)系统的容量 给出的方法,看一下如何测量网络容量,如果真的能测量网络容量,传输算法就好设计了。 先给出答案,很遗憾,根本无法测量,请阅读 why we don’t know how to sim…

react-intl——react国际化使用方案

国际化介绍 i18n&#xff1a;internationalization 国家化简称&#xff0c;首字母首尾字母间隔的字母个数尾字母&#xff0c;类似的还有 k8s(Kubernetes) <br /> React-intl是 React 中最受欢迎的库。 使用步骤 安装 # use npm npm install react-intl -D # use yarn项目…

MySOL数据库进阶篇——存储引擎

一.MySQL体系结构图&#xff1a; MySQL的结构体系主要包含以下几个方面的内容&#xff1a; 1. 服务器层&#xff08;Server Layer&#xff09;&#xff1a;提供了MySQL的核心服务&#xff0c;包括连接管理、查询解析、优化等功能。 2. 存储引擎&#xff08;Storage Engine&am…

每日OJ_牛客_点击消除(栈)

目录 牛客_点击消除&#xff08;栈&#xff09; 解析代码 牛客_点击消除&#xff08;栈&#xff09; 点击消除_牛客题霸_牛客网 描述&#xff1a; 牛牛拿到了一个字符串。 他每次“点击”&#xff0c;可以把字符串中相邻两个相同字母消除&#xff0c;例如&#xff0c;字符…

图表类型识别系统源码分享

图表类型识别检测系统源码分享 [一条龙教学YOLOV8标注好的数据集一键训练_70全套改进创新点发刊_Web前端展示] 1.研究背景与意义 项目参考AAAI Association for the Advancement of Artificial Intelligence 项目来源AACV Association for the Advancement of Computer Vis…

Mysql的高级查询:SQL关联查询(内连接/外连接/自连接)/子查询

一.关联查询&#xff1a; 定义&#xff1a;关联查询又叫连接查询 常见&#xff1a;内连接/外连接/自连接 1.内连接(无存在主从表&#xff09; 语法&#xff1a;inner join ...on 定义&#xff1a;组合两个表的记录&#xff0c;返回关联字段相符的记录&#xff0c;也就是返…

Cryptography and Network Security: Principles and Practice(Lesson 2 notes)

Playfair Cipher Operation steps Construct a 55 letter matrix based onThe matrix is ​​constructed using a keyword (key)Then from left to right, from top to bottom; fill in the letters of the key in sequence (note: repeated letters in the key are not fil…

Open-Sora代码详细解读(2):时空3D VAE

Diffusion Models视频生成 前言&#xff1a;目前开源的DiT视频生成模型不是很多&#xff0c;Open-Sora是开发者生态最好的一个&#xff0c;涵盖了DiT、时空DiT、3D VAE、Rectified Flow、因果卷积等Diffusion视频生成的经典知识点。本篇博客从Open-Sora的代码出发&#xff0c;深…

嵌入式软件黑盒测试技术与案例分析培训

黑盒测试&#xff0c;也称为基于需求的测试&#xff0c;是目前嵌入式软件领域普遍开展的一种测试过程。目前&#xff0c;随着人们对软件质量要求的不断提升&#xff0c;行业对软件测试和验证的要求也在不断提高&#xff0c;对测试的充分性和准确性要求越来越苛刻。当前行业内&a…