Project Structure(Backend)
The updated dependencies in package.json file of backend will look like:
"dependencies": {
"cors": "^2.8.5",
"express": "^4.18.3"
},
Example: Create the required files and write the following code.
Javascript
// server.js import express from 'express' ; import cors from 'cors' ; const app = express(); app.use(cors()); app.get( '/' , async (req, res) => { try { const { text, source, target } = req.query; const url = `https: //api.mymemory.translated.net/get?q=${text}&langpair=${source}|${target}`; const response = await fetch(url); const json = await response.json(); const matches = await json.matches; const translatedText = matches[matches.length - 1].translation || 'No translation found' ; res.send(translatedText); } catch (error) { console.log(error); res.send( 'Something went wrong!' ); } }); app.listen(5000, () => { console.log( 'Server is running on port 5000' ); }); |
Start your server using the following command.
node server.js
Text Translation Tool using MERN Stack
In this article, we’ll walk through the step-by-step process of creating a text translation application with MongoDB, React, ExpressJS, and NodeJS. This application will provide users with a user-friendly interface for translating text between different languages.
Output Preview: Let us have a look at how the final output will look like.