DEV Community

Cover image for Text Editor with Text to Speech and Speech to Text!!!
Mostafa Said
Mostafa Said

Posted on

Text Editor with Text to Speech and Speech to Text!!!

Hello everyone πŸ‘‹,

Few hours left for the hachathon to be over and I'm still thinking of ways to improve my projects, So allow me to introduce you to some new features in Wordleit Markdown Editor.

Wordleit Logo

What's new?

1- Added AI TTS (Text to Speech) article reader.

  • It stops on (click, refresh session and on complete).
  • It doesn't read the markdown symbols, only the text.

2- Upload Mp3 and convert to text.

More about the new features

So now you can make your device read back to you whatever you wrote. this will help you review your articles without having to read it over and over again to spot mistakes.

Also you can upload any mp3 file to Wordleit and receive your mp3 file as a text in the Markdown Editor! This allowing you to transform any audio, course or tutorial you like into an article of your own.

I was going to add Youtube to MP3 api so that you can convert any youtube into mp3 and then upload it to Wordleit but unfortunately I don't have time. But it's definitely an option, there are so many online youtube to mp3 convertors out there.

Submission category:

Well, Wordleit has a Markdown Text Editor, Video Streamer and AI bot. It's really hard to tell which category :D But I tried to submit each project in the one that made sense to me

Have a look at this demo

Try it out yourself:

Head to Wordleit homepage and select Wordleit Editor πŸš€

https://wordleit.herokuapp.com

Link to Code on GitHub:

GitHub logo MooseSaeed / wordleit

Wordleit is a free open source markdown text editor that gives you a seamless experience as both a reader and a writer. Supported with AI Speech Recognition.

Welcome To My Wordleit πŸ‘‹

Documentation License: https://github.com/MooseSaeed/wordleup/blob/master/LICENSE Twitter: Moose_Said

Image description

Wordleit Editor is a free open source markdown text editor that gives you a seamless experience as both a reader and a writer. Supported with AI Speech Recognition. Text to speech - Speech to text - Mp3 to Text.

Wordleit Streamer is a free open source video streamer and online transcriptor tool.

Wordleit Grammy AI Bot AI speaking Bot created to serve your purposes.

🏠 Homepage

✨ Editor Demo

✨ Streamer Demo

✨ Grammy Demo

Hackathon Submissions:

  • Wordleit Editor

1- https://dev.to/moose_said/write-articles-with-ai-speech-recognition-and-live-preview-508k

2- https://dev.to/moose_said/use-vocal-commands-to-apply-markdown-to-your-article-99

3- https://dev.to/moose_said/text-editor-with-text-to-speech-and-speech-to-text-4l37

  • Wordleit Streamer:

https://dev.to/moose_said/online-video-streamer-and-audio-transcription-2ein

  • Wordleit Grammy

https://dev.to/moose_said/add-ai-robot-to-your-portfolio-or-company-website-3045

Author

πŸ‘€ Mostafa Said

🀝 Contributing

Contributions, issues and feature requests are welcome!
Feel free to check issues page.

βš™οΈ Built with:

        <ul dir="auto">
            <li>
                <div dir="auto">
                    <a target="_blank" rel="noopener noreferrer nofollow" href="https://avatars.githubusercontent.com/u/17422641?s=200"><img src="https://avatars.githubusercontent.com/u/17422641?s=200" alt="deepgram" width="40" height="40" style="max-width: 100%;"></a>
                    <a href="https://deepgram.com/" rel="nofollow">Deepgram</a>
                </div>
            </li>
            <li>
                <div dir="auto">
                    <a target="_blank" rel="noopener noreferrer nofollow" href="https://user-images.githubusercontent.com/23579958/143738613-d374adcf-24b8-4f44-8e75-673d5681c1a5.png"><img src="https://user-images.githubusercontent.com/23579958/143738613-d374adcf-24b8-4f44-8e75-673d5681c1a5.png" alt="plyr" height="20" style="max-width: 100%;"></a>
                    <a href="https://github.com/redxtech/vue-plyr">Plyr Vue</a>
                </div>
            </li>
            <li>
                <div dir="auto">
                    <a target="_blank" rel="noopener noreferrer nofollow" href="https://camo.githubusercontent.com/881b3d162f1a3fdb13e9c8507afe5f40be73e59b6c4b907901e06a1ccd7f70df/68747470733a2f2f6d61726b65642e6a732e6f72672f696d672f6c6f676f2d626c61636b2e737667"><img src="https://camo.githubusercontent.com/881b3d162f1a3fdb13e9c8507afe5f40be73e59b6c4b907901e06a1ccd7f70df/68747470733a2f2f6d61726b65642e6a732e6f72672f696d672f6c6f676f2d626c61636b2e737667" alt="deepgram" width="40" height="40" data-canonical-src="https://marked.js.org/img/logo-black.svg" style="max-width: 100%;"></a>
                    <a href="https://marked.js.org/" rel="nofollow">MarkedJS</a>
                </div>
            </li>
            <li>
                <div dir="auto">
                    <a target="_blank" rel="noopener noreferrer nofollow" href="https://camo.githubusercontent.com/61d22c54c2d885e3364693b3a15d0a8d17d7f4294f14ff41622fdd64373b10b0/68747470733a2f2f692e6962622e636f2f534b564a526e732f616e696d6174656373732e706e67"><img src="https://camo.githubusercontent.com/61d22c54c2d885e3364693b3a15d0a8d17d7f4294f14ff41622fdd64373b10b0/68747470733a2f2f692e6962622e636f2f534b564a526e732f616e696d6174656373732e706e67" alt="animatecss" width="40" height="40" data-canonical-src="https://i.ibb.co/SKVJRns/animatecss.png" style="max-width: 100%;"></a>
                    <a href="https://animate.style/" rel="nofollow">AnimateCSS</a>
                </div>
            </li>
        </ul>
Enter fullscreen mode Exit fullscreen mode

Show your support

Give a ⭐️ if this project helped you!

…



Top comments (2)

Collapse
 
jameskrdf profile image
jameskrdf

Good job!
happy wheels

Collapse
 
moose_said profile image
Mostafa Said

Thanks! :)