Hey everyone!

I'm trying to create multi language web site and using next-i18next.While I trying to connect /tr or /fr it's only show pages/index.js file. And also it's not changing html tag's lang attribute

- I want to use i18n
- There are 4 language for website
- Every language landing page design is different from each others
- For example I don't want to translate only pages/about also I want to translate pages/fr/about too. They are different from each others

//_app.js
import { appWithTranslation } from 'next-i18next';

function App({ Component, pageProps }) {
  return <Component {...pageProps} />
}

export default appWithTranslation(App); 

Folder structure
pages/index.js
pages/tr/index.js
pages/fr/index.js

/** @type {import('next').NextConfig} */
const nextConfig = {
  i18n: {
    defaultLocale: 'en',   // default lang
    locales: ['en', 'tr', 'fr'], 
  },
};
module.exports = nextConfig;