You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: src/content/learn/add-react-to-an-existing-project.md
+3-15Lines changed: 3 additions & 15 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -20,19 +20,11 @@ Giả sử bạn có một ứng dụng web tại `example.com` được phát t
20
20
21
21
Đây là cách chúng tôi đề xuất để cài đặt:
22
22
23
-
<<<<<<< HEAD
24
-
1.**Xây dựng phần React của ứng dụng của bạn** sử dụng một trong những [nền tảng ứng dụng (framework) sử dụng React](/learn/creating-a-react-app).
23
+
1.**Xây dựng phần React của ứng dụng của bạn** sử dụng một trong những [nền tảng ứng dụng (framework) sử dụng React](/learn/start-a-new-react-project).
25
24
2.**Chỉ định `/some-app` là *đường dẫn gốc*** trong cấu hình ứng dụng của bạn. (xem hướng dẫn với: [Next.js](https://nextjs.org/docs/app/api-reference/config/next-config-js/basePath), [Gatsby](https://www.gatsbyjs.com/docs/how-to/previews-deploys-hosting/path-prefix/)).
26
25
3.**Cấu hình máy chủ của bạn hoặc một proxy** để tất cả các requests ở `/some-app/` được xử lý bởi ứng dụng React của bạn.
27
26
28
-
Điều này đảm bảo phần React của ứng dụng của bạn có thể được [hưởng lợi từ các tiêu chuẩn tốt nhất](/learn/creating-a-react-app#full-stack-frameworks) đã được tích hợp sẵn trong các Frameworks đó.
29
-
=======
30
-
1.**Build the React part of your app** using one of the [React-based frameworks](/learn/start-a-new-react-project).
31
-
2.**Specify `/some-app` as the *base path*** in your framework's configuration (here's how: [Next.js](https://nextjs.org/docs/app/api-reference/config/next-config-js/basePath), [Gatsby](https://www.gatsbyjs.com/docs/how-to/previews-deploys-hosting/path-prefix/)).
32
-
3.**Configure your server or a proxy** so that all requests under `/some-app/` are handled by your React app.
33
-
34
-
This ensures the React part of your app can [benefit from the best practices](/learn/build-a-react-app-from-scratch#consider-using-a-framework) baked into those frameworks.
35
-
>>>>>>> e9a7cb1b6ca1659b42d81555ecef0cd554b7a983
27
+
Điều này đảm bảo phần React của ứng dụng của bạn có thể được [hưởng lợi từ các tiêu chuẩn tốt nhất](/learn/build-a-react-app-from-scratch#consider-using-a-framework) đã được tích hợp sẵn trong các Frameworks đó.
36
28
37
29
Nhiều frameworks dựa trên React là full-stack và cho phép ứng dụng React của bạn tận dụng các tính năng của máy chủ. Tuy nhiên, bạn có thể sử dụng cùng một phương pháp ngay cả khi bạn không thể hoặc không muốn chạy JavaScript trên máy chủ. Trong trường hợp đó, hãy chuẩn bị HTML/CSS/JS export ([`next export` output](https://nextjs.org/docs/advanced-features/static-html-export) cho Next.js, mặc định cho Gatsby) tại `/some-app/`.
Chú ý là nội dung HTML ban đầu từ `index.html` được giữ nguyên, nhưng component `NavigationBar` React của bạn giờ đây hiển thị bên trong `<nav id="navigation">` từ trong HTML của bạn. Hãy đọc [`tài liệu sử dụng createRoot`](/reference/react-dom/client/createRoot#rendering-a-page-partially-built-with-react) để tìm hiểu thêm về cách hiển thị các component React trong một trang HTML hiện có.
159
151
160
-
<<<<<<< HEAD
161
-
Khi bạn sử dụng React với một dự án tồn tại trước đó, thường thì bạn sẽ bắt đầu với những component tương tác nhỏ (như nút bấm), và sau đó dần dần "tiến lên trước" cho tới khi toàn bộ trang web của bạn được xây dựng bằng React. Khi bạn đạt đến đó, chúng tôi khuyến nghị hãy chuyển đổi sang một [React framework](/learn/creating-a-react-app) ngay sau đó để có thể sử dụng tối ưu React.
162
-
=======
163
-
When you adopt React in an existing project, it's common to start with small interactive components (like buttons), and then gradually keep "moving upwards" until eventually your entire page is built with React. If you ever reach that point, we recommend migrating to [a React framework](/learn/start-a-new-react-project) right after to get the most out of React.
164
-
>>>>>>> e9a7cb1b6ca1659b42d81555ecef0cd554b7a983
152
+
Khi bạn sử dụng React với một dự án tồn tại trước đó, thường thì bạn sẽ bắt đầu với những component tương tác nhỏ (như nút bấm), và sau đó dần dần "tiến lên trước" cho tới khi toàn bộ trang web của bạn được xây dựng bằng React. Khi bạn đạt đến đó, chúng tôi khuyến nghị hãy chuyển đổi sang một [React framework](/learn/start-a-new-react-project) ngay sau đó để có thể sử dụng tối ưu React.
165
153
166
154
## Sử dụng React Native trong một ứng dụng di động native hiện có {/*using-react-native-in-an-existing-native-mobile-app*/}
Copy file name to clipboardExpand all lines: src/content/learn/your-first-component.md
+1-5Lines changed: 1 addition & 5 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -215,11 +215,7 @@ Khi mà một component con cần dữ liệu từ cha, [hãy truyền nó qua p
215
215
216
216
Hầu hết các ứng dụng React đều sử dụng component từ đầu đến cuối. Điều này có nghĩa là bạn không chỉ sử dụng component cho những phần có thể tái sử dụng như các nút (button) mà còn cho các phần lớn hơn như sidebar, các danh sách và đích đến cuối, các trang hoàn chỉnh! Component là một cách tiện lợi để tổ chức code UI và markup, ngay cả khi một số chúng chỉ được sử dụng một lần.
217
217
218
-
<<<<<<< HEAD
219
-
[Các framwork React](/learn/creating-a-react-app) nâng điều này lên một tầm cao mới. Thay vì chỉ sử dụng một trang HTML rỗng và để React "điều khiển" việc quản lý trang với JavaScript, chúng *cũng* tạo ra HTML tự động từ các React component của bạn. Điều này khiến cho ứng dụng của bạn có thể hiển thị một số nội dung trước khi code JavaScript chạy.
220
-
=======
221
-
[React-based frameworks](/learn/start-a-new-react-project) take this a step further. Instead of using an empty HTML file and letting React "take over" managing the page with JavaScript, they *also* generate the HTML automatically from your React components. This allows your app to show some content before the JavaScript code loads.
222
-
>>>>>>> e9a7cb1b6ca1659b42d81555ecef0cd554b7a983
218
+
[Các framwork React](/learn/start-a-new-react-project) nâng điều này lên một tầm cao mới. Thay vì chỉ sử dụng một trang HTML rỗng và để React "điều khiển" việc quản lý trang với JavaScript, chúng *cũng* tạo ra HTML tự động từ các React component của bạn. Điều này khiến cho ứng dụng của bạn có thể hiển thị một số nội dung trước khi code JavaScript chạy.
223
219
224
220
Tuy vậy, rất nhiều website chỉ dùng React để [thêm tương tác cho các trang HTML đã có sẵn](/learn/add-react-to-an-existing-project#using-react-for-a-part-of-your-existing-page). Họ có rất nhiều các root component thay vì một cái cho cả trang. Bạn có thể dùng nhiều hoặc ít React tùy thích.
0 commit comments