feat: Add multi-language support (EN, KN) for UI and content

README.md

@@ -10,14 +10,15 @@ A platform for learning engineering concepts in Kannada through YouTube playlist
 - [Adding a Blog Post](#adding-a-blog-post)
 - [Updating Existing Content](#updating-existing-content)
 - [Contribution Guidelines](#contribution-guidelines)
+- [Internationalization (i18n)](#internationalization-i18n)
 - [Local Development](#local-development)
 - [Notes for Contributors](#notes-for-contributors)
 - [Features](#features)
 - [Technologies Used](#technologies-used)
 
 ## Adding a New Course
 
-1. Add course details to `src/data/courses.json`:
+1. Add course details to `src/data/courses.json` (this will serve as the default/English version):
 
 ```json
 {
@@ -47,6 +48,10 @@ A platform for learning engineering concepts in Kannada through YouTube playlist
 }
 ```
 
+3. **(Optional) Add translations for the course:**
+   - Create `src/data/courses.kn.json` (for Kannada) or `src/data/courses.<lang-code>.json` for other languages. Copy the structure from `courses.json` and translate the `title`, `description`, and `difficulty` fields for the new course.
+   - Create `src/data/videos/course-id.kn.json` (for Kannada) or `src/data/videos/course-id.<lang-code>.json`. Copy the structure from `src/data/videos/course-id.json` and translate video `title` fields.
+
 ## Adding a Blog Post
 
 1. Create a new directory in `src/blogs/your-blog-slug/` with:
@@ -69,7 +74,13 @@ A platform for learning engineering concepts in Kannada through YouTube playlist
 }
 ```
 
-3. Write your blog content in `content.md` using markdown format.
+3. Write your blog content in `content.md` (this will be the default/English version) using markdown format.
+
+4. **(Optional) Add translations for the blog post:**
+   - Create `src/blogs/your-blog-slug/metadata.kn.json` (for Kannada) or `metadata.<lang-code>.json`. Translate the relevant fields (`title`, `description`, `tags`).
+   - Create `src/blogs/your-blog-slug/content.kn.md` (for Kannada) or `content.<lang-code>.md`. Translate the markdown content.
+   *(Note: Full internationalization for blogs is pending an update to `src/utils/blogUtils.ts`)*
+
 
 ## Updating Existing Content
 
@@ -109,6 +120,31 @@ A platform for learning engineering concepts in Kannada through YouTube playlist
    - Test locally before submitting
    - Provide clear description of changes
 
+## Internationalization (i18n)
+
+This project uses `i18next` for internationalization.
+- **UI Strings**: Stored in `public/locales/<lang-code>/translation.json`.
+  - `en`: English
+  - `kn`: Kannada
+- **Content (Courses, Links)**: Translated versions of JSON files are stored with a language code suffix, e.g., `courses.kn.json`, `links.kn.json`. The application attempts to load the current language's file and falls back to the default (e.g., `courses.json`) if not found.
+- **Content (Blogs)**:
+    - Metadata: `metadata.<lang-code>.json` (e.g., `metadata.kn.json`).
+    - Content: `content.<lang-code>.md` (e.g., `content.kn.md`).
+    - *Note: Full support for loading localized blog content is currently pending an update to `src/utils/blogUtils.ts`.*
+
+### Adding a New Language for UI Strings
+
+1.  **Add language code to `i18n.ts`**: In the `supportedLngs` array.
+2.  **Create new locale file**: Copy `public/locales/en/translation.json` to `public/locales/<new-lang-code>/translation.json`.
+3.  **Translate strings**: Update the values in the new `translation.json` file.
+4.  **Test**: Switch to the new language using the language switcher in the header and verify UI text.
+
+### Adding Translations for Content
+
+- **Courses & Videos**: Create `courses.<new-lang-code>.json` and `videos/<course-id>.<new-lang-code>.json` files.
+- **Links**: Create `links.<new-lang-code>.json`.
+- **Blogs**: Create `metadata.<new-lang-code>.json` and `content.<new-lang-code>.md` for each blog post.
+
 ## Local Development
 
 ### Prerequisites
@@ -137,7 +173,8 @@ A platform for learning engineering concepts in Kannada through YouTube playlist
      ```env
      VITE_GITHUB_TOKEN=your_github_token_here
      ```
-   - Replace `your_github_token_here` with the token you copied
+   - Replace `your_github_token_here` with the token you copied.
+   - **Important for Deployment:** This token is crucial for the Contributor Leaderboard to function correctly on a deployed site (e.g., Netlify). Ensure `VITE_GITHUB_TOKEN` is also set as an environment variable in your hosting provider's settings. Without it, GitHub API requests will be unauthenticated and likely fail due to rate limiting, preventing the leaderboard from loading.
 
 ### Installation
 
@@ -164,10 +201,11 @@ npm run build
 
 ## Notes for Contributors
 
-- All content should be in both English and Kannada where possible
-- Maintain consistent formatting across all JSON files
-- Keep video descriptions concise and informative
-- Update the README if you add new features or change the structure
+- All content should be in both English and Kannada where possible. See the [Internationalization (i18n)](#internationalization-i18n) section for details on how to structure translated content.
+- For UI text, ensure corresponding keys are added to all language files in `public/locales/`.
+- Maintain consistent formatting across all JSON files.
+- Keep video descriptions concise and informative.
+- Update the README if you add new features or change the structure.
 
 ## Features
 

package.json

@@ -11,9 +11,13 @@
   },
   "dependencies": {
     "canvas-confetti": "^1.9.2",
+    "i18next": "^25.2.1",
+    "i18next-browser-languagedetector": "^8.2.0",
+    "i18next-http-backend": "^2.2.0",
     "lucide-react": "^0.344.0",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
+    "react-i18next": "^15.5.3",
     "react-markdown": "^10.1.0",
     "react-router-dom": "^6.22.3",
     "react-toastify": "^11.0.5",