Member-only story

Text Translation Application in Gatsby

Shamaz Saeed
3 min readOct 28, 2021

In this article, I'll show how to build a text translation app with gatsby.

So let’s get started.

Application setup

Install the gatsby starter template by running the following command.

npm init gatsby

Add material UI to the project. To add material UI to the project we have to install the material UI plugin and add the plugin in the gatsby-config.js file.

npm install gatsby-plugin-material-ui@next @emotion/react

Create a new file gatsby-config.js and add the following code in that file. This will enable material UI features in our app.


module.exports = { plugins: [`gatsby-plugin-material-ui`], };

Now our application will support the material UI in the code.

Now we will update index.js with the following code.

Update CSS file with the following code.

Create an account to read the full story.

The author made this story available to Medium members only.
If you’re new to Medium, create a new account to read this story on us.

Already have an account? Sign in

Shamaz Saeed
Shamaz Saeed

Written by Shamaz Saeed

Software Engineer | ReactJS, VueJS, NextJS expert | Passionate about building scalable apps & improving performance | Sharing my web dev journey.

No responses yet

What are your thoughts?

Recommended from Medium

Lists

See more recommendations