Examples

Here is a collection of example applications using the i18next Phrase In-Context Editor Post Processor library.

Basic (Vanilla js)

This application features basic functionalities of the i18next (opens new window) and the Phrase In-Context Editor (opens new window).

Go to, and clone examples/basic directory of i18next Phrase In-Context Editor Post Processor repo (opens new window).

To run the example use following commands:

# yarn
yarn
yarn start

# npm
npm i
npm run start

Now the application is visible under http://localhost:1234/ (opens new window).

This application uses a demo Phrase (opens new window) account under the hood. To login, use authentication data provided below:

E-Mail: demo@phrase.com
Password: phrase

React i18next

This application features basic functionalities of the react-i18next (opens new window) and the Phrase In-Context Editor (opens new window).

Go to, and clone examples/react directory of i18next Phrase In-Context Editor Post Processor repo (opens new window).

To run the example use following commands:

# yarn
yarn
yarn start

# npm
npm i
npm run start

Now the application is visible under http://localhost:3000/ (opens new window).

The page will reload if you make edits. Any lint errors will be visible in the console.

This application uses a demo Phrase (opens new window) account under the hood. To login, use authentication data provided below:

E-Mail: demo@phrase.com
Password: phrase

Vue i18next

This application features basic functionalities of the @panter/vue-i18next (opens new window) and the Phrase In-Context Editor (opens new window).

Go to, and clone examples/vue directory of i18next Phrase In-Context Editor Post Processor repo (opens new window).

To run the example, use following commands:

# yarn
yarn
yarn serve

# npm
npm i
npm run serve

Now the application will be visible under http://localhost:8080/ (opens new window).

The page will reload if you make edits. Any lint errors will be visible in the console.

This application uses a demo Phrase (opens new window) account under the hood. To login, use authentication data provided below:

E-Mail: demo@phrase.com
Password: phrase

Notice

This demo was built with the use of Vue CLI (opens new window). For more details, see the Configuration Reference (opens new window).

Next.js i18next

This application features basic functionalities of the nextjs-i18next (opens new window) and the Phrase In-Context Editor (opens new window).

Go to, and clone examples/next directory of i18next Phrase In-Context Editor Post Processor repo (opens new window).

To run the example use following commands:

# yarn
yarn
yarn dev

# npm
npm i
npm run dev

Now the application is visible under http://localhost:3000/ (opens new window).

The page will reload if you make edits. Any nextjs errors will be visible within console.

This application uses a demo Phrase (opens new window) account under the hood. To login, use authentication data provided below:

E-Mail: demo@phrase.com
Password: phrase

Notice

This demo was built on top of the starter template from Learn Next.js guide (opens new window) and the next-i18next simple example project (opens new window).

I18next http middleware (Express.js)

This application features basic functionalities of the i18next-http-middleware (opens new window) and the Phrase In-Context Editor (opens new window).

Go to, and clone examples/express-basic directory of i18next Phrase In-Context Editor Post Processor repo (opens new window).

To run the example use following commands:

# yarn
yarn
yarn start

# npm
npm i
npm run start

Now the application is visible under http://localhost:8080/ (opens new window).

You need to rerun yarn start command every time you've made any change to the server's code. Any Express errors will be visible within console.

This application uses a demo Phrase (opens new window) account under the hood. To login, use authentication data provided below:

E-Mail: demo@phrase.com
Password: phrase

Notice

This demo was built on top of the basic example from i18next-http-middleware repository (opens new window).