Fixes grammar and updates translation to be more meaningful.

Author: ytrkptl

src/content/learn/add-react-to-an-existing-project.md

@@ -16,24 +16,24 @@ title: હાલના પ્રોજેક્ટમાં React ઉમેર
 
 ## તમારી હાલની વેબસાઇટના સંપૂર્ણ સબરૂટ (subroute) માટે React નો ઉપયોગ કરવો {/*using-react-for-an-entire-subroute-of-your-existing-website*/}
 
-ધારો કે તમારી પાસે `example.com` પર એક વેબ એપ્લિકેશન છે જે બીજી સર્વર ટેક્નોલોજીથી (જેમ કે Rails થી), બનેલું છે, અને તમે `example.com/some-app/` થી શરૂ થતા તમામ રૂટ્સને સંપૂર્ણપણે React માં અમલ કરવા માંગો છો.
+ધારો કે તમારી પાસે `example.com` પર એક વેબ એપ્લિકેશન છે જે બીજી સર્વર ટેક્નોલોજીથી (જેમ કે Rails થી) બનેલું છે, અને તમે `example.com/some-app/` થી શરૂ થતા તમામ રૂટ્સને સંપૂર્ણપણે React માં અમલ કરવા માંગો છો.
 
-તેને સેટ કરવા માટે અમે અહીં ભલામણ કરીએ છીએ:
+તેને સેટઅપ કરવા માટે અમે અહીં ભલામણ કરીએ છીએ:
 1. **React-આધારિત ફ્રેમવર્કનો ઉપયોગ કરીને તમારી એપ્લિકેશનનો React ભાગ બનાવો**(/learn/start-a-new-react-project).
 2. **તમારા ફ્રેમવર્કના કન્ફિગરેશનમાં `/some-app` ને base path તરીકે સ્પષ્ટ કરો** (અહીં કેવી રીતે કરવું તે છે: [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/)).
 3. **તમારા સર્વર અથવા પ્રોક્સીને એવી રીતે ગોઠવો** કે જેથી કરીને `/some-app/` હેઠળની તમામ વિનંતીઓ (requests) તમારી React એપ્લિકેશન દ્વારા હેન્ડલ કરવામાં આવે.
 
-આ સુનિશ્ચિત કરે છે કે તમારી એપ્લિકેશનનો React ભાગ તે ફ્રેમવર્કમાં રહેલી [શ્રેષ્ઠ પદ્ધતિઓનો લાભ મેળવી શકે](/learn/creating-a-react-app#full-stack-frameworks).
+આવી ગોઠવણી સુનિશ્ચિત કરે છે કે તમારી એપ્લિકેશનનો React ભાગ તે ફ્રેમવર્કમાં રહેલી [શ્રેષ્ઠ પદ્ધતિઓનો લાભ મેળવી શકે](/learn/creating-a-react-app#full-stack-frameworks).
 
-ઘણા React-આધારિત ફ્રેમવર્ક ફુલ-સ્ટેક હોય છે અને તમારી React એપ્લિકેશનને સર્વરનો લાભ લેવા દે છે. જો કે, જો તમે સર્વર પર જાવાસ્ક્રિપ્ટ ચલાવી શકતા નથી અથવા ચલાવવા માંગતા નથી, તો પણ તમે તે જ અભિગમનો ઉપયોગ કરી શકો છો. તે કિસ્સામાં, તેના બદલે `/some-app/` પર HTML/CSS/JS નો export ([`next export` output](https://nextjs.org/docs/advanced-features/static-html-export) for Next.js, default for Gatsby) સર્વ (serve) કરો.
+ઘણા React-આધારિત ફ્રેમવર્ક ફુલ-સ્ટેક હોય છે અને તમારી React એપ્લિકેશનને સર્વરનો લાભ લેવા દે છે. જો કે, જો તમે સર્વર પર જાવાસ્ક્રિપ્ટ ચલાવી શકતા નથી અથવા ચલાવવા માંગતા નથી, તો પણ તમે તે જ અભિગમનો ઉપયોગ કરી શકો છો. તે કિસ્સામાં, તેના બદલે `/some-app/` પર HTML/CSS/JS નો export સર્વ (serve) કરો (Next.js માટે [`next export` output](https://nextjs.org/docs/advanced-features/static-html-export), Gatsby માટે ડિફોલ્ટ).
 
 ## તમારા હાલના પેજના એક ભાગ માટે React નો ઉપયોગ કરવો {/*using-react-for-a-part-of-your-existing-page*/}
 
 ધારો કે તમારી પાસે બીજી ટેક્નોલોજીથી બનેલું હાલનું પેજ છે (કાં તો સર્વર જેમ કે Rails અથવા ક્લાયન્ટ જેમ કે Backbone) થી બનેલું, અને તમે તે પેજ પર ક્યાંક ઇન્ટરેક્ટિવ React કમ્પોનેન્ટ્સ રેન્ડર કરવા માંગો છો. React ને એકીકૃત (integrate) કરવાની આ એક સામાન્ય રીત છે -- હકીકતમાં, Meta પર ઘણા વર્ષો સુધી React નો મોટાભાગનો ઉપયોગ આ રીતે જ થતો હતો!
 
 તમે આ બે સ્ટેપમાં કરી શકો છો:
 
-1. **એક જાવાસ્ક્રિપ્ટ એન્વાયર્નમેન્ટ સેટ કરો** જે તમને JSX સિન્ટેક્સ વાપરવા દે, તમારા કોડને [`import`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import) / [`export`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/export) સિન્ટેક્સ સાથે મોડ્યુલોમાં વિભાજીત કરવા દે, અને [`npm`](https://www.npmjs.com/) પેકેજ રજિસ્ટ્રીમાંથી પેકેજો (ઉદાહરણ તરીકે, React) નો ઉપયોગ કરવા દે.
+1. **એક જાવાસ્ક્રિપ્ટ એન્વાયર્નમેન્ટ સેટઅપ કરો**  કે જે તમને [JSX સિન્ટેક્સ](/learn/writing-markup-with-jsx) વાપરવા દે, તમારા કોડને [`import`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import) / [`export`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/export) સિન્ટેક્સ સાથે મોડ્યુલોમાં વિભાજીત કરવા દે, અને [`npm`](https://www.npmjs.com/) પેકેજ રજિસ્ટ્રીમાંથી પેકેજો (ઉદાહરણ તરીકે, React) નો ઉપયોગ કરવા દે.
 2. **તમારા React કમ્પોનેન્ટ્સને રેન્ડર કરો** એ પેજમાં કે જ્યાં તમે તેમને જોવા માંગો છો.
 
 ચોક્કસ અભિગમ તમારા હાલના પેજ સેટઅપ પર આધાર રાખે છે, તો ચાલો અમુક વિગતો જોઈએ.
@@ -44,7 +44,7 @@ title: હાલના પ્રોજેક્ટમાં React ઉમેર
 
 * **જો તમારી એપ્લિકેશન `import` સ્ટેટમેન્ટનો ઉપયોગ કરનારી ફાઇલોમાં પહેલેથી જ વિભાજિત છે,** તો તમારી પાસે જે સેટઅપ છે તેનો જ ઉપયોગ કરવાનો પ્રયાસ કરો. તપાસો કે તમારા JS કોડમાં `<div />` લખવાથી સિન્ટેક્સ એરર આવે છે કે નહીં. જો તે સિન્ટેક્સ એરરનું કારણ બને છે, તો તમારે JSX નો ઉપયોગ કરવા માટે [`Babel સાથે તમારા જાવાસ્ક્રિપ્ટ કોડને ટ્રાન્સફોર્મ કરવાની`](https://babeljs.io/setup) અને [`Babel React preset`](https://babeljs.io/docs/babel-preset-react) સક્ષમ કરવાની જરૂર પડી શકે છે.
 
-* **જો તમારી એપ્લિકેશન પાસે જાવાસ્ક્રિપ્ટ મોડ્યુલો કમ્પાઇલ કરવા માટે હાલનું સેટઅપ નથી, તો તેને [`Vite`](https://github.com/vitejs/awesome-vite#integrations-with-backends) દ્વારા સેટઅપ કરો. Vite સમુદાય Rails, Django, અને Laravel સહિત બેકએન્ડ ફ્રેમવર્ક સાથે [`ઘણા ઇન્ટિગ્રેશન જાળવે છે`](https://github.com/vitejs/awesome-vite#integrations-with-backends). જો તમારું બેકએન્ડ ફ્રેમવર્ક લિસ્ટમાં નથી, તો તમારા બેકએન્ડ સાથે Vite બિલ્ડ્સને જાતે ઇન્ટિગ્રેટ કરવા માટે [`આ માર્ગદર્શિકાને અનુસરો`](https://vite.dev/guide/backend-integration.html).
+* **જો તમારી એપ્લિકેશન પાસે જાવાસ્ક્રિપ્ટ મોડ્યુલો કમ્પાઇલ કરવા માટે હાલનું સેટઅપ નથી,** તો તેને [`Vite`](https://github.com/vitejs/awesome-vite#integrations-with-backends) દ્વારા સેટઅપ કરો. Vite સમુદાય Rails, Django, અને Laravel સહિત બેકએન્ડ ફ્રેમવર્ક સાથે [`ઘણા ઇન્ટિગ્રેશન જાળવે છે`](https://github.com/vitejs/awesome-vite#integrations-with-backends). જો તમારું બેકએન્ડ ફ્રેમવર્ક લિસ્ટમાં નથી, તો તમારા બેકએન્ડ સાથે Vite બિલ્ડ્સને જાતે ઇન્ટિગ્રેટ કરવા માટે [`આ માર્ગદર્શિકાને અનુસરો`](https://vite.dev/guide/backend-integration.html).
 
 તમારું સેટઅપ કામ કરે છે કે નહીં તે તપાસવા માટે, તમારા પ્રોજેક્ટ ફોલ્ડરમાં આ આદેશ (command) ચલાવો:
 
@@ -80,7 +80,7 @@ root.render(<h1>Hello, world</h1>);
 
 </Sandpack>
 
-જો તમારા પેજની સમગ્ર સામગ્રી "Hello, world!" દ્વારા બદલવામાં આવી હતી, તો બધું કામ કરી ગયું! આગળ વાંચતા રહો.
+જો તમારા પેજની સમગ્ર સામગ્રી "Hello, world!" દ્વારા બદલાયેલ , તો બધું કામ કરી ગયું! આગળ વાંચતા રહો.
 
 <Note>
 હાલના પ્રોજેક્ટમાં પ્રથમ વખત મોડ્યુલર જાવાસ્ક્રિપ્ટ એન્વાયર્નમેન્ટને એકીકૃત કરવું ભયજનક (intimidating) લાગી શકે છે પરંતુ તે યોગ્ય છે! જો તમે અટવાઈ જાઓ, તો અમારા [`સમુદાય સંસાધનો`](/community) અથવા [`Vite Chat`](https://chat.vite.dev/) અજમાવી જુઓ.
@@ -105,15 +105,15 @@ root.render(<h1>Hello, world</h1>);
 
 આ કોડ કાઢી નાખો.
 
-તેના બદલે, તમે કદાચ તમારા React કમ્પોનેન્ટ્સને તમારા HTML માં ચોક્કસ જગ્યાએ રેન્ડર કરવા માંગો છો. તમારું HTML પેજ ખોલો (અથવા સર્વર ટેમ્પલેટ્સ જે તેને જનરેટ કરે છે) અને કોઈપણ ટેગમાં એક યુનિક [`id`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/id) એટ્રિબ્યુટ ઉમેરો, ઉદાહરણ તરીકે:
+તેના બદલે, તમે કદાચ તમારા React કમ્પોનેન્ટ્સને તમારા HTML માં ચોક્કસ જગ્યાએ રેન્ડર કરવા માંગશો. તમારું HTML પેજ ખોલો (અથવા સર્વર ટેમ્પલેટ્સ જે તેને જનરેટ કરે છે) અને કોઈપણ ટેગમાં એક યુનિક [`id`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/id) એટ્રિબ્યુટ ઉમેરો, ઉદાહરણ તરીકે:
 
 ```html
 <!-- ... somewhere in your html ... -->
 <nav id="navigation"></nav>
 <!-- ... more html ... -->
 ```
 
-આ તમને [`document.getElementById`](https://developer.mozilla.org/en-US/docs/Web/API/Document/getElementById) સાથે તે HTML એલીમેન્ટ શોધવા દે છે અને તેને [`createRoot`](/reference/react-dom/client/createRoot) માં પાસ કરવા દે છે જેથી તમે અંદર તમારો પોતાનો React કમ્પોનેન્ટ રેન્ડર કરી શકો:
+આ તમને [`document.getElementById`](https://developer.mozilla.org/en-US/docs/Web/API/Document/getElementById) દ્વારા  તે HTML એલીમેન્ટને  શોધવા દે છે અને તેને [`createRoot`](/reference/react-dom/client/createRoot) માં પાસ કરવા દે છે જેથી તમે અંદર તમારો પોતાનો React કમ્પોનેન્ટ રેન્ડર કરી શકો:
 
 <Sandpack>
 
@@ -144,7 +144,7 @@ root.render(<NavigationBar />);
 
 </Sandpack>
 
-નોંધ કરો કે `index.html` માંથી મૂળ HTML સામગ્રી કેવી રીતે સચવાય છે, પરંતુ તમારો પોતાનો NavigationBar React કમ્પોનેન્ટ હવે તમારા HTML માંથી <nav id="navigation"> ની અંદર દેખાય છે. હાલના HTML પેજ ની અંદર React કમ્પોનેન્ટ્સને રેન્ડર કરવા વિશે વધુ જાણવા માટે [`createRoot ઉપયોગ દસ્તાવેજીકરણ`](/reference/react-dom/client/createRoot#rendering-a-page-partially-built-with-react) વાંચો.
+નોંધ કરો કે `index.html` માંથી મૂળ HTML સામગ્રી કેવી રીતે સચવાય છે, પરંતુ તમારો પોતાનો `NavigationBar` React કમ્પોનેન્ટ હવે તમારા HTML માં `<nav id="navigation">` ની અંદર દેખાય છે. હાલના HTML પેજ ની અંદર React કમ્પોનેન્ટ્સને રેન્ડર કરવા વિશે વધુ જાણવા માટે [`createRoot ઉપયોગ દસ્તાવેજીકરણ`](/reference/react-dom/client/createRoot#rendering-a-page-partially-built-with-react) વાંચો.
 
 જ્યારે તમે હાલના પ્રોજેક્ટમાં React અપનાવો છો, ત્યારે નાના ઇન્ટરેક્ટિવ કમ્પોનેન્ટ્સ (જેમ કે બટનો) થી પ્રારંભ કરવું સામાન્ય છે, અને પછી ધીમે ધીમે ઊંચે ચડવું (moving upwards) જ્યાં સુધી આખરે તમારું આખું પેજ React થી બનેલું હોય. જો તમે ક્યારેય તે બિંદુએ પહોંચો છો, તો અમે React નો સૌથી વધુ લાભ મેળવવા માટે તરત જ [React ફ્રેમવર્ક](/learn/start-a-new-react-project) પર સ્થાનાંતરિત થવાની ભલામણ કરીએ છીએ.