Fix file names in part 1 & 2 Chinese translation.

Author: dsr20030703

src/content/1/zh/part1a.md

@@ -58,7 +58,7 @@ Vite[默认](https://vitejs.dev/config/server-options.html#server-port)在端口
 ![](../../images/1/1-vite4.png)
 
 <!-- The code of the application resides in the <i>src</i> folder. Let's simplify the default code such that the contents of the file main.jsx looks like this:-->
-应用的代码位于<i>src</i>文件夹中。让我们简化默认代码，使文件<i>main.jsx</i>的内容如下所示：
+应用的代码位于<i>src</i>文件夹中。让我们简化默认代码，使文件main.jsx的内容如下所示：
 
 ```js
 import ReactDOM from 'react-dom/client'
@@ -294,7 +294,7 @@ JSX是“类[XML](https://developer.mozilla.org/en-US/docs/Web/XML/XML_introduct
 ### 多个组件
 
 <!-- Let's modify the file <i>App.jsx</i> as follows: -->
-让我们修改<i>App.js</i>文件如下：
+让我们修改<i>App.jsx</i>文件如下：
 
 ```js
 // highlight-start
@@ -787,8 +787,8 @@ const App = () => {
 export default App
 ```
 
-<!-- and remove the extra files App.css and index.css, also remove the directory assets.-->
-然后删除多余的文件App.css和index.css，以及目录assets。
+<!-- and remove the extra files <i>App.css</i> and <i>index.css</i>, also remove the directory <i>assets</i>. -->
+然后删除多余的文件<i>App.css</i>和<i>index.css</i>，以及目录<i>assets</i>。
 
 <!-- Unfortunately, the entire application is in the same component. Refactor the code so that it consists of three new components: <i>Header</i>, <i>Content</i>, and <i>Total</i>. All data still resides in the <i>App</i> component, which passes the necessary data to each component using <i>props</i>. <i>Header</i> takes care of rendering the name of the course, <i>Content</i> renders the parts and their number of exercises and <i>Total</i> renders the total number of exercises.-->
 整个应用都在同一个组件中。重构代码，使其由三个新组件组成：<i>Header</i>、<i>Content</i>和<i>Total</i>。所有数据仍驻留在<i>App</i>组件中，使用<i>props</i>将必要的数据传递给每个组件。<i>Header</i>负责显示课程的名称，<i>Content</i>显示各部分及其练习的数量，<i>Total</i>显示练习的总数量。

src/content/1/zh/part1c.md

@@ -199,8 +199,8 @@ const Hello = ({ name, age }) => {
 <!-- Up to this point, our applications have been static — their appearance remains unchanged after the initial rendering. But what if we wanted to create a counter that increases in value, either over time or when a button is clicked? -->
 到目前为止，我们所有的应用都是静态的——在最初的渲染之后，其外观保持不变。如果我们想创建一个计数器，其值随着时间的推移或点击按钮而增加呢？
 
-<!-- Let's start with the following. File <i>App.js</i> becomes:-->
-让我们从将文件<i>App.js</i>变成下面的样子开始：
+<!-- Let's start with the following. File <i>App.jsx</i> becomes: -->
+让我们从将文件<i>App.jsx</i>变成下面的样子开始：
 
 ```js
 const App = (props) => {
@@ -213,8 +213,8 @@ const App = (props) => {
 export default App
 ```
 
-<!-- And file <i>index.js</i> becomes:-->
-将文件<i>index.js</i>改成：
+<!-- And file <i>main.jsx</i> becomes: -->
+将文件<i>main.jsx</i>改成：
 
 ```js
 import ReactDOM from 'react-dom/client'
@@ -285,7 +285,7 @@ setInterval(() => {
 接下来，让我们借助React的[状态hook](https://react.dev/learn/state-a-components-memory)来给我们的应用的<i>App</i>组件添加状态。
 
 <!-- We will change the application as follows. <i>main.jsx</i> goes back to: -->
-我们将改变应用的内容如下。<i>main.js</i>回到：
+我们将改变应用的内容如下。<i>main.jsx</i>回到：
 
 ```js
 import ReactDOM from 'react-dom/client'
@@ -295,8 +295,8 @@ import App from './App'
 ReactDOM.createRoot(document.getElementById('root')).render(<App />)
 ```
 
-<!-- and <i>App.js</i> changes to the following:-->
-而<i>App.js</i>则改为：
+<!-- and <i>App.jsx</i> changes to the following: -->
+而<i>App.jsx</i>则改为：
 
 ```js
 import { useState } from 'react' // highlight-line

src/content/1/zh/part1d.md

@@ -1413,7 +1413,7 @@ rm -rf node_modules/ && npm i
 注意你的应用只需要在一个浏览器会话中运行。一旦你刷新页面，所收集的反馈消失也不要紧。
 
 <!-- It is advisable to use the same structure that is used in the material and previous exercise. File <i>main.jsx</i> is as follows: -->
-建议使用和教材与之前练习中相同的结构。文件<i>main.js</i>如下：
+建议使用和教材与之前练习中相同的结构。文件<i>main.jsx</i>如下：
 
 ```js
 import ReactDOM from 'react-dom/client'
@@ -1584,10 +1584,10 @@ export default App
 ```
 
 <!-- Content of the file <i>main.jsx</i> is the same as in previous exercises. -->
-文件<i>main.js</i>的内容与之前的练习相同。
+文件<i>main.jsx</i>的内容与之前的练习相同。
 
 <!-- Find out how to generate random numbers in JavaScript, eg. via search engine or on [Mozilla Developer Network](https://developer.mozilla.org). Remember that you can test generating random numbers e.g. straight in the console of your browser.-->
-找出如何在JavaScript中生成随机数，例如通过搜索引擎或去[Mozilla Developer Network](https://developer.mozilla.org)。记住，你可以直接在浏览器的控制台测试生成随机数等。
+查找如何在JavaScript中生成随机数，例如通过搜索引擎或去[Mozilla Developer Network](https://developer.mozilla.org)。记住，你可以直接在浏览器的控制台测试生成随机数等。
 
 <!-- Your finished application could look something like this:-->
 你完成的应用可能如下所示：

src/content/2/zh/part2a.md

@@ -107,8 +107,8 @@ Visual Studio Code里可以很方便地创建“Snippets”（代码片段），
 <!-- Now, we will build the frontend, or the user interface (the part users see in their browser), using React, similar to the example application from [part 0](/en/part0). -->
 现在我们将用React做一个类似[第0章节](/zh/part0)中示例程序的前端，或者叫用户界面（用户在浏览器中所看到的部分）。
 
-<!-- Let's start with the following (the file <i>App.js</i>):-->
-让我们从下面开始（文件<i>App.js</i>）：
+<!-- Let's start with the following (the file <i>App.jsx</i>): -->
+让我们从下面开始（文件<i>App.jsx</i>）：
 
 ```js
 const App = (props) => {
@@ -130,7 +130,7 @@ export default App
 ```
 
 <!-- The file <i>main.jsx</i> looks like this: -->
-文件<i>main.js</i>如下所示：
+文件<i>main.jsx</i>如下所示：
 
 ```js
 import ReactDOM from 'react-dom/client'