ಎಸ್ಇಒ

NodeJS ಮತ್ತು ಇತರ ಬ್ಯಾಕೆಂಡ್ ಸ್ಟಾಕ್‌ಗಳೊಂದಿಗೆ ರಿಯಾಕ್ಟ್ ಅಥವಾ ವ್ಯೂ ಬಳಸಿ ಪ್ರತಿಕ್ರಿಯಾತ್ಮಕ ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್‌ಗಾಗಿ ಎಸ್‌ಇಒ

ಹೇಗೆ ಎಂಬುದರ ಕುರಿತು ನಮ್ಮ ನೇರ ಚರ್ಚೆಯ ಸಮಯದಲ್ಲಿ HTML5, CSS3 ಮತ್ತು ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್‌ನೊಂದಿಗೆ ಪವರ್ SEO ಸ್ನೇಹಿ ಮಾರ್ಕ್ಅಪ್ ಈ ವರ್ಷದ ಆರಂಭದಲ್ಲಿ, ನಾವು ರಿಯಾಕ್ಟ್ ಬಗ್ಗೆ ಮಾತನಾಡಲು ಉತ್ತಮ ಸಮಯವನ್ನು ಕಳೆದಿದ್ದೇವೆ. ಎಸ್‌ಇಒಗಾಗಿ ನೀವು ನೆನಪಿನಲ್ಲಿಟ್ಟುಕೊಳ್ಳಬೇಕಾದದ್ದನ್ನು ಪ್ರತಿಕ್ರಿಯಿಸಲು ನಾನು ಸೂಕ್ಷ್ಮ ವ್ಯತ್ಯಾಸಗಳನ್ನು ಅಗೆಯಲು ಹೋಗುತ್ತೇನೆ. ಚರ್ಚೆಯಲ್ಲಿ ಭಾಗವಹಿಸಿದ ಡುಡಾದಲ್ಲಿನ ಕಾರ್ಯತಂತ್ರದ ಏಕೀಕರಣಗಳ ನಿರ್ದೇಶಕರಾದ ರಸ್ ಜೆಫ್ರಿಯವರ ವಿಶ್ಲೇಷಣೆಗಾಗಿ ನಾವು ಕೋಡ್ ಅನ್ನು ಬಳಸುತ್ತೇವೆ.

ಪ್ರತಿಕ್ರಿಯಿಸಬೇಕೆ ಅಥವಾ ಪ್ರತಿಕ್ರಿಯಿಸಬೇಡವೇ?

ರಿಯಾಕ್ಟ್ ಫ್ರೇಮ್‌ವರ್ಕ್ ವೆಬ್‌ಸೈಟ್ (ಅಪ್ಲಿಕೇಶನ್) ಪುಟಗಳು ಅವುಗಳ ಕೆಳಗೆ ಮ್ಯಾಜಿಕ್ ಉರಿಯುತ್ತಿರುವಂತೆ ಭಾಸವಾಗಬಹುದು, ಏಕೆಂದರೆ ಡ್ಯಾಶ್‌ಬೋರ್ಡ್ ವಿವರಗಳನ್ನು ಉತ್ಸಾಹಭರಿತ ಬಳಕೆದಾರರ ಸಮುದಾಯದೊಂದಿಗೆ ಕಾನ್ಸರ್ಟ್‌ನಲ್ಲಿ ಇರಿಸಲಾಗುತ್ತದೆ, ಉದಾಹರಣೆಗೆ ನೀವು Facebook ಮತ್ತು Twitter ನಿಂದ ನಿರೀಕ್ಷಿಸುವ ಅನುಭವ.

ಆದಾಗ್ಯೂ, ನೀವು ಯೋಜನೆಯಲ್ಲಿ ಯಾವ ತಂತ್ರಜ್ಞಾನವನ್ನು ಬಳಸುತ್ತೀರಿ ಎಂಬುದನ್ನು ವ್ಯಾಪಾರದ ಅವಶ್ಯಕತೆಗಳು ನಿರ್ದೇಶಿಸಬೇಕು. ನೀವು ಫೇಸ್‌ಬುಕ್ ಪ್ರಕಾರದ ಡೈನಾಮಿಕ್ ಅಗತ್ಯವಿರುವ ಅಪ್ಲಿಕೇಶನ್ ಅನ್ನು ಬರೆಯುತ್ತಿದ್ದರೆ, ಅದನ್ನು ತಲುಪಿಸಲು ಪ್ರತಿಕ್ರಿಯಾತ್ಮಕ ಚೌಕಟ್ಟನ್ನು ರಚಿಸಲು ನೀವು ಹೂಡಿಕೆ ಮಾಡಲು ಬಯಸುತ್ತೀರಿ. ಆದರೂ, ವಾಸ್ತವದಲ್ಲಿ, ಕೆಲವೇ ಕೆಲವು ಸೈಟ್‌ಗಳು ಆ ರೀತಿಯ ಅವಶ್ಯಕತೆಗಳನ್ನು ಹೊಂದಿವೆ. ಹೆಚ್ಚಿನ ಸಂದರ್ಭಗಳಲ್ಲಿ ನೀವು ಮೂಲಭೂತ ಕಾರ್ಯಕ್ಷಮತೆಯ ಕಾರಣಗಳಿಗಾಗಿ jQuery ಅಥವಾ ವೆನಿಲ್ಲಾ ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್‌ನಿಂದ ದೂರವಿರಲು ಸಾಧ್ಯವಾದರೆ ನೀವು ಉತ್ತಮವಾಗಿರುತ್ತೀರಿ.

ನೀವು ಬೆರಳೆಣಿಕೆಯ ಪುಟಗಳಲ್ಲಿ ಒಂದು ಪ್ರತಿಕ್ರಿಯಾತ್ಮಕ ಅಂಶವನ್ನು ಬಳಸಿದರೆ, ನಿಮ್ಮ ಪ್ರತಿಕ್ರಿಯಾತ್ಮಕ ಕೋಡ್ ಅನ್ನು ಎಲ್ಲಿ ಮತ್ತು ಯಾವಾಗ ಅಗತ್ಯವಿದೆಯೋ ಅದನ್ನು ನಿರ್ಬಂಧಿಸಲು ಮಾರ್ಗಗಳಿವೆ. ಅದನ್ನು ಲೋಡ್ ಮಾಡಲು ಸರ್ವರ್-ಸೈಡ್, (ಅಥವಾ ಕ್ಲೈಂಟ್-ಸೈಡ್) ಷರತ್ತುಬದ್ಧ ಕೋಡ್ ಅನ್ನು ಬರೆಯಿರಿ. ನೀವು ಮಾಡಲು ಬಯಸಿದರೆ ಎಲ್ಲಾ ಶಕ್ತಿ ಪಾಪ್ಅಪ್ ಮಾದರಿಗಳು, ಸಂವಾದಾತ್ಮಕ ಮೆನುಗಳು, ಮತ್ತು ಟ್ಯಾಬ್ ಮಾಡಲಾದ ವಿಷಯ ಇತ್ಯಾದಿ., ನಂತರ ಪ್ರತಿಕ್ರಿಯಾತ್ಮಕ ಲೈಬ್ರರಿಗಳ ವೆಚ್ಚ ಮತ್ತು ಲಾಭದ ಪರಿಗಣನೆಯು ಇತರ ವಿಧಾನಗಳ ವಿರುದ್ಧ ಅವರಿಗೆ ಅನುಕೂಲಕರವಾಗುವುದಿಲ್ಲ.

SEO ಗಾಗಿ ರೆಂಡರಿಂಗ್ ತಂತ್ರಗಳು

ನಿಮ್ಮ ವೆಬ್ ಅಪ್ಲಿಕೇಶನ್ ಎಸ್‌ಇಒಗಾಗಿ ಹೇಗೆ ಮತ್ತು ಯಾವಾಗ ಪ್ರಮುಖ ವಿಷಯವನ್ನು ನಿರೂಪಿಸುತ್ತದೆ ಎಂಬುದರ ಕುರಿತು ನೀವು ಖಂಡಿತವಾಗಿಯೂ ವಿಭಿನ್ನವಾಗಿ ಯೋಚಿಸಬೇಕಾಗುತ್ತದೆ. ಅದು ನಮ್ಮ ಚರ್ಚೆಯ ದ್ವಿತೀಯಾರ್ಧದಲ್ಲಿ ನಮಗೆ ತಂದ ರಸ್ ಕಲಿಕೆ. ಸರ್ವರ್-ಸೈಡ್ ಅನ್ನು ಹೇಗೆ ನಿರ್ಮಿಸುವುದು ಮತ್ತು ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ ಜೊತೆಗೆ ಆಪ್ಟಿಮೈಸ್ಡ್ ಅಪ್ಲಿಕೇಶನ್ ಶೆಲ್ ಅನ್ನು ಸಾಗಿಸುವುದು ಹೇಗೆ ಎಂಬುದಕ್ಕೆ ಅವರು ಉದಾಹರಣೆಗಳನ್ನು ತೋರಿಸುತ್ತಾರೆ, ಆದ್ದರಿಂದ ಕ್ರಾಲರ್‌ಗಳು ಎಸ್‌ಇಒಗೆ ಅಗತ್ಯವಾದದ್ದನ್ನು ಪಡೆಯಬಹುದು ಮತ್ತು ಉಳಿದವು ಕ್ಲೈಂಟ್-ಸೈಡ್ ಅನ್ನು 'ಹೈಡ್ರೇಶನ್' ಬಳಸಿ ಪ್ರದರ್ಶಿಸಲಾಗುತ್ತದೆ.

ಸಂಪೂರ್ಣ ಚರ್ಚೆಯನ್ನು ಇಲ್ಲಿ ವೀಕ್ಷಿಸಿ.

ಚೌಕಟ್ಟುಗಳು

ಈ ಸಂದರ್ಭದಲ್ಲಿ ಅಪ್ಲಿಕೇಶನ್ ಪ್ರೋಗ್ರಾಮಿಂಗ್ ಸಾಮಾನ್ಯವಾಗಿ ಮುಂಭಾಗದ ಗ್ರಂಥಾಲಯಕ್ಕಿಂತ ಹೆಚ್ಚಿನದನ್ನು ಒಳಗೊಂಡಿರುತ್ತದೆ. ಯುಟಿಲಿಟಿ ಸ್ಕ್ರಿಪ್ಟ್‌ಗಳೊಂದಿಗೆ ಕಾನ್ಫಿಗರೇಶನ್ ಫೈಲ್ ಲೇಔಟ್ ವಿನ್ಯಾಸದ ಮೇಲಿನ ಸಮಾವೇಶವು ರಿಯಾಕ್ಟ್ ಅಥವಾ ವ್ಯೂಗಾಗಿ ಫ್ರೇಮ್‌ವರ್ಕ್ ಎಂದು ಉಲ್ಲೇಖಿಸಲ್ಪಡುತ್ತದೆ. Next ಮತ್ತು Nuxt ಕ್ರಮವಾಗಿ NodeJS-ಆಧಾರಿತ ರಿಯಾಕ್ಟ್ ಮತ್ತು Vue ಚೌಕಟ್ಟುಗಳಾಗಿವೆ.

ಫ್ರೇಮ್‌ವರ್ಕ್‌ಗಳು ಸಾಂಪ್ರದಾಯಿಕ ವಿಶೇಷಣಗಳು ಮತ್ತು ಉತ್ತಮ ಅಭ್ಯಾಸಗಳ ಪ್ರಕಾರ ಸ್ಕ್ಯಾಫೋಲ್ಡಿಂಗ್ ಪ್ರಾಜೆಕ್ಟ್ ಫೈಲ್‌ಗಳು ಮತ್ತು ಸೇವೆಗಳನ್ನು ಸರಳಗೊಳಿಸುತ್ತದೆ. ಹಲವಾರು ಜನಪ್ರಿಯ ಬ್ಯಾಕೆಂಡ್ ಪ್ರೋಗ್ರಾಮಿಂಗ್ ಭಾಷೆಗಳೊಂದಿಗೆ ರಿಯಾಕ್ಟ್ ಮತ್ತು ವ್ಯೂ ಅನ್ನು ಹೇಗೆ ಸಂಯೋಜಿಸುವುದು ಎಂಬುದನ್ನು ಪ್ರದರ್ಶಿಸುವ ಗಿಟ್‌ಹಬ್ ಯೋಜನೆಗಳಿಗೆ ರಸ್ ನಮಗೆ ಲಿಂಕ್‌ಗಳನ್ನು ಒದಗಿಸಿದೆ. ನೀವು NodeJS ಗಿಂತ ಬ್ಯಾಕೆಂಡ್‌ನಲ್ಲಿ ವಿಭಿನ್ನ ರನ್‌ಟೈಮ್ ಪ್ರಕ್ರಿಯೆಯನ್ನು ಬಯಸಿದರೆ ಅವುಗಳನ್ನು ಪರಿಶೀಲಿಸಿ.

  • ಪೈಥಾನ್ ರಿಯಾಕ್ಟ್ / ಪೈಥಾನ್ ವ್ಯೂ
  • PHP ರಿಯಾಕ್ಟ್ / PHP Vue
  • ರೂಬಿ ರಿಯಾಕ್ಟ್ / ರೂಬಿ ವ್ಯೂ
  • ಜಾವಾ ರಿಯಾಕ್ಟ್ / ಜಾವಾ ವ್ಯೂ

NodeJS ನೊಂದಿಗೆ SEO ಕೋಡ್ ತುಣುಕುಗಳು

ನೀವು ಎಂಟರ್‌ಪ್ರೈಸ್ ಅಥವಾ ಆರಂಭಿಕ ಹಂತದ ಅವಶ್ಯಕತೆಗಳನ್ನು ತಲುಪಿದಾಗ, ಚೌಕಟ್ಟಿನೊಂದಿಗೆ ಸೇವಾ ಮಟ್ಟದ ಒಪ್ಪಂದವು ಸಾಧ್ಯವಾಗದಿರಬಹುದು. NodeJS (ಎಕ್ಸ್‌ಪ್ರೆಸ್‌ನೊಂದಿಗೆ) ಆಧಾರಿತ ಎಸ್‌ಇಒ ಕೋಡ್ ತುಣುಕುಗಳೊಂದಿಗೆ ಪ್ರಾರಂಭಿಸುವುದರ ಮೂಲಕ ರಸ್ ನಮ್ಮನ್ನು ನಡೆಸುತ್ತದೆ.

ಮಾದರಿ ರಿಯಾಕ್ಟ್ ಮತ್ತು ವ್ಯೂ ಯೋಜನೆಗಳಲ್ಲಿ ಮೂರು ಪ್ರಮುಖ ಫೈಲ್‌ಗಳು ನಮ್ಮ ವಿಶ್ಲೇಷಣೆಗೆ ಅಗತ್ಯವಾದ ಕೋಡ್ ಅನ್ನು ಒಳಗೊಂಡಿರುತ್ತವೆ:

  • ದಿ app.js ಫೈಲ್ "ಬ್ಲಾಗ್" ಅಪ್ಲಿಕೇಶನ್ ಶೆಲ್ ಅನ್ನು ನಿಯಂತ್ರಿಸುತ್ತದೆ.
  • ದಿ server.js ಫೈಲ್ ಎಕ್ಸ್‌ಪ್ರೆಸ್ ಲೈಬ್ರರಿಯಲ್ಲಿ ಎಳೆಯುತ್ತದೆ, SSR ಗಾಗಿ ರೆಂಡರ್ ವಿಧಾನಗಳನ್ನು ಒಳಗೊಂಡಂತೆ ವಿನಂತಿಯ ನಿರ್ವಹಣೆಗಾಗಿ ಅದನ್ನು ಕಾನ್ಫಿಗರ್ ಮಾಡುತ್ತದೆ.
  • index.js ಫೈಲ್, NodeJS ರನ್‌ಟೈಮ್ ಪ್ರಕ್ರಿಯೆಗೆ ಪ್ರವೇಶ ಬಿಂದುವಾಗಿ ಕಾರ್ಯನಿರ್ವಹಿಸುತ್ತದೆ.

ಎಸ್‌ಇಒ ಸ್ನೇಹಿ ಪ್ರತಿಕ್ರಿಯೆ

ದಿ App.js SPA-ಶೈಲಿಗಾಗಿ ತುಣುಕುಗಳನ್ನು ಅವಲಂಬಿಸದ URL ಗಳಿಗೆ ಎಸ್‌ಇಒ ಸ್ನೇಹಿ ಮಾರ್ಗಗಳನ್ನು ರೂಟಿಂಗ್ ಮಾಡುವುದನ್ನು ರಿಯಾಕ್ಟ್ ಪ್ರದರ್ಶಿಸುತ್ತದೆ ವರ್ಚುವಲ್ ಪುಟ ವೀಕ್ಷಣೆಗಳು. ರಲ್ಲಿ server.js 'ಸಂದರ್ಭ' ಡೇಟಾ ವಸ್ತುವು ಕರೆ ಮಾಡಲು ಸಂಪನ್ಮೂಲ ವಿವರಗಳನ್ನು ಸೂಚಿಸುತ್ತದೆ ReactDOMServer.renderToString() URL ಮತ್ತು ಸಂಭಾವ್ಯ ಇತರ ಮಾನದಂಡಗಳ ಆಧಾರದ ಮೇಲೆ ಸಂದರ್ಭದೊಂದಿಗೆ ನಮ್ಮ ಅಪ್ಲಿಕೇಶನ್ ಶೆಲ್ ಅನ್ನು ನಿರೂಪಿಸಲು.

ದಿ server.js ಹೆಚ್ಚಿನ ಪರಿಷ್ಕರಣೆಗಳಿಗಾಗಿ ಫೈಲ್ ಡೇಟಾ ಸಂದರ್ಭ ವಸ್ತುವನ್ನು ಹೊಂದಿದೆ. ಅಂತಿಮವಾಗಿ ಬ್ರೌಸರ್‌ಗೆ ಕಳುಹಿಸುವ ಮೊದಲು ನಿರ್ಮಿಸಲಾದ ಅಪ್ಲಿಕೇಶನ್ ಶೆಲ್‌ಗಾಗಿ SEO ಅನ್ನು ಪೂರ್ಣಗೊಳಿಸಲು ಶೀರ್ಷಿಕೆ ಮತ್ತು ಇತರ ಮೆಟಾ ಡೇಟಾವನ್ನು ಬದಲಿಸುವುದನ್ನು ರಸ್ ಪ್ರದರ್ಶಿಸುತ್ತದೆ.

ಕೊನೆಯದಾಗಿ, index.js NodeJS ಪ್ರಕ್ರಿಯೆಗೆ ಆರಂಭಿಕ ಹಂತವಾಗಿ ಕಾರ್ಯನಿರ್ವಹಿಸುತ್ತದೆ ಮತ್ತು ReactDOM.hydrate() ಶೆಲ್ ಲೋಡ್ ಆದ ನಂತರ ಕಡಿಮೆ ಮುಖ್ಯವಾದ ಸಹಾಯಕ ವಿಷಯದೊಂದಿಗೆ ನಮ್ಮ ಅಪ್ಲಿಕೇಶನ್ ಅನ್ನು ಹೊರಹಾಕಲು ಬಳಸಲಾಗುತ್ತದೆ.

ಒಂದು 'ಬಿಲ್ಡ್' ಡೈರೆಕ್ಟರಿ ಒಳಗೊಂಡಿದೆ ಸೂಚ್ಯಂಕ SSR ಟೆಂಪ್ಲೇಟ್ ನಿರ್ಮಾಣಕ್ಕಾಗಿ ಗುರಿಯ ಕಡತವಾಗಿ. ಎರಡು ಇತರ ಫೈಲ್‌ಗಳು, ಘಟಕಗಳು ಮುಖಪುಟ ಮತ್ತು ಪೋಸ್ಟ್ಗಳು, a ಬಳಸಿ ಸಂಗ್ರಹಿಸಲಾಗುತ್ತದೆ .ಜಸ್ ವಿಸ್ತರಣೆ, ಇದು ಸಂಪ್ರದಾಯದಿಂದ ಸೂಚಿಸಲ್ಪಟ್ಟಿದೆ ಮತ್ತು ಆದ್ದರಿಂದ ಆಮದು ಹೇಳಿಕೆಗಳಲ್ಲಿ ಸ್ಪಷ್ಟವಾಗಿ ಉಚ್ಚರಿಸುವ ಅಗತ್ಯವಿಲ್ಲ. ಕಾಂಪೊನೆಂಟ್ ಫೈಲ್‌ಗಳ ವಿಶ್ಲೇಷಣೆಯನ್ನು ನಾವು ತ್ವರಿತವಾಗಿ ಬಿಟ್ಟುಬಿಡುತ್ತೇವೆ, ಘಟಕ ಫೈಲ್‌ಗಳನ್ನು ಮರು-ಸಂಘಟಿತವಾಗಿ ಕಂಡುಹಿಡಿಯುವುದು ವಿಶಿಷ್ಟವಾಗಿದೆ ಎಂದು ಹೇಳುವುದನ್ನು ಹೊರತುಪಡಿಸಿ ಘಟಕs ಉಪಕೋಶ.

ರಸ್‌ನ ಉದಾಹರಣೆಗಳಲ್ಲಿ, ಘಟಕ ಫೈಲ್‌ಗಳನ್ನು ಒಳಗೊಂಡಂತೆ ಎಲ್ಲಾ ಫೈಲ್‌ಗಳು ಪ್ರಾಜೆಕ್ಟ್ ಬೇಸ್ ಡೈರೆಕ್ಟರಿಯಲ್ಲಿವೆ. ರಿಯಾಕ್ಟ್ ಫೈಲ್‌ಗಳಿಗಾಗಿ ಡೈರೆಕ್ಟರಿ ಟ್ರೀ ಈ ರೀತಿ ಕಾಣುತ್ತದೆ:
├── App.js
├── Home.js
├── Posts.js
├── ನಿರ್ಮಾಣ
│ └── index.html
├── index.js
└── server.js

ನೀವು JSX ಸಿಂಟ್ಯಾಕ್ಸ್‌ನೊಂದಿಗೆ ಪರಿಚಿತರಾಗಿಲ್ಲದಿದ್ದರೆ, ಇದು XML ನೊಂದಿಗೆ ರಿಯಾಕ್ಟ್ ಕಾಂಪೊನೆಂಟ್ ಎನ್‌ಕೋಡಿಂಗ್‌ಗಾಗಿ ಉದ್ದೇಶಿಸಲಾದ ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ ಭಾಷಾ ವಿಸ್ತರಣೆಯಾಗಿದೆ ಆದ್ದರಿಂದ ಟೆಂಪ್ಲೇಟ್ ಫೈಲ್‌ಗಳು ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ ಅನ್ನು ಒಳಗೊಂಡಿರುತ್ತದೆ. ಮಕ್ಕಳ ಘಟಕಗಳನ್ನು ಆಮದು ಮಾಡಿಕೊಳ್ಳಲಾಗುತ್ತದೆ ಮತ್ತು ನಂತರ ಹೆಸರು ಸಂಪ್ರದಾಯದ ಮೂಲಕ ಉಲ್ಲೇಖಿಸಲಾಗುತ್ತದೆ (Home.js ಮತ್ತು Posts.js ನಕ್ಷೆ ಗೆ ಮತ್ತು ಕ್ರಮವಾಗಿ) XML ಟೆಂಪ್ಲೇಟ್ ಬ್ಲಾಕ್‌ನಲ್ಲಿ.

ರಸ್ ಬಳಸಿಕೊಳ್ಳುತ್ತದೆ ರಿಯಾಕ್ಟ್-ರೂಟರ್-ಡಾಮ್ ಗ್ರಂಥಾಲಯಗಳು (ನೀವು NPM ಮೂಲಕ ಇನ್‌ಸ್ಟಾಲ್ ಮಾಡಬೇಕಾಗಬಹುದು): ರೂಟರ್ ಮತ್ತು ಸ್ಟ್ಯಾಟಿಕ್ ರೂಟರ್, ಸ್ವಿಚ್ ಮತ್ತು ನ್ಯಾವ್‌ಲಿಂಕ್. ಈ ಲೈಬ್ರರಿಗಳು ಸಾಮಾನ್ಯ ಕಾರ್ಯಗಳ ಅನುಕೂಲಕ್ಕಾಗಿ ಸಿದ್ಧ ಸಹಾಯಕರನ್ನು ಒದಗಿಸುತ್ತವೆ, ಉದಾಹರಣೆಗೆ NavLink 'to' ಸಹಾಯಕವನ್ನು ಬಳಸಿಕೊಂಡು url ಮಾರ್ಗ ಅಥವಾ ಸಂಪನ್ಮೂಲಕ್ಕೆ HTML ಲಿಂಕ್‌ಗಳನ್ನು ರಚಿಸುವುದು, ಇದು ರೈಲ್‌ನ 'link_to' ಸಹಾಯಕಕ್ಕೆ ಸ್ವಲ್ಪಮಟ್ಟಿಗೆ ಹೋಲುತ್ತದೆ.

ಸ್ವಿಚ್ ಮತ್ತು ರೂಟರ್ ಮೂಲಕ App.js url ಪಥಗಳನ್ನು ಹೊಂದಿಸಲು ಸಿಂಟ್ಯಾಕ್ಸ್ ಅನ್ನು ರಸ್ ಪ್ರದರ್ಶಿಸುತ್ತದೆ. ಸೂಚ್ಯಂಕ ಮಾರ್ಗದ ಹೇಳಿಕೆಗಾಗಿ 'ನಿಖರವಾದ' ಕೀವರ್ಡ್ ಅನ್ನು ಗಮನಿಸಿ. ಇದು ನಿಖರವಾಗಿ '/' ಅನ್ನು ಮಾತ್ರ ಹೊಂದಿಸುವ ಅಗತ್ಯವಿದೆ ಅಥವಾ ಅದು ಅಪ್ಲಿಕೇಶನ್‌ನ ಪ್ರತಿಯೊಂದು ಮಾರ್ಗಕ್ಕೂ ಹೊಂದಿಕೆಯಾಗುತ್ತದೆ! 'ನಿಖರವಾದ' ಕೀವರ್ಡ್ ಅನ್ನು ಬಳಸುವುದರಿಂದ '/ಪೋಸ್ಟ್‌ಗಳು' ಮತ್ತು '/ಪೋಸ್ಟ್‌ಗಳು/ಹಲೋ-ವರ್ಲ್ಡ್' ಇತ್ಯಾದಿಗಳಿಗೆ ಹೊಂದಿಕೆಯಾಗುವ ದುರಾಸೆಯ ಹೊಂದಾಣಿಕೆಯಿಂದ ಡೀಫಾಲ್ಟ್ ಮಾನದಂಡವನ್ನು ಬದಲಾಯಿಸುತ್ತದೆ.

In server.js ನೆಟ್‌ವರ್ಕ್‌ನಲ್ಲಿ ನಮ್ಮ ಅಪ್ಲಿಕೇಶನ್ ಅನ್ನು ಪೂರೈಸಲು ಅಗತ್ಯವಿರುವ ಪೋರ್ಟ್ ಕೇಳುಗ ಮತ್ತು ಪ್ರತಿಕ್ರಿಯೆ ವಿಧಾನಗಳೊಂದಿಗೆ ನಮ್ಮ ಅಪ್ಲಿಕೇಶನ್ ಅನ್ನು ಹೊಂದಿಸಲು ಎಕ್ಸ್‌ಪ್ರೆಸ್ ಎಂಬ ಸಾಮಾನ್ಯ ಬಾಹ್ಯ ಚೌಕಟ್ಟನ್ನು ರಸ್ ಬಳಸುತ್ತದೆ. ನೀವು ಸ್ಥಳೀಯವಾಗಿ ಕೆಲಸ ಮಾಡುತ್ತಿದ್ದರೆ, ನೀವು ಲೋಕಲ್ ಹೋಸ್ಟ್ ವಿನಂತಿಗಳ ಮೂಲಕ ಕೆಲಸ ಮಾಡಲು ಯೋಜಿಸಿರುವ ತೆರೆದ ಪೋರ್ಟ್ ಅನ್ನು ಹೊಂದಿಸಲು ಸ್ಥಳೀಯ ಪರಿಸರ ವೇರಿಯಬಲ್ ಪೋರ್ಟ್ ಅನ್ನು ಸ್ಥಾಪಿಸಲು ನೀವು ಬಯಸುತ್ತೀರಿ. ಉತ್ಪಾದನೆಯಲ್ಲಿ, ಇದನ್ನು ಸಾಮಾನ್ಯವಾಗಿ ಪೋರ್ಟ್ 80 ಗೆ ಹೊಂದಿಸಬೇಕಾಗುತ್ತದೆ.

ವ್ಯೂ ಫ್ರೇಮ್ವರ್ಕ್

ಕೊನೆಯದಾಗಿ, Vue ಫ್ರೇಮ್‌ವರ್ಕ್ ಹೆಚ್ಚು ಸಮೀಪಿಸಬಹುದಾದ ಪ್ರತಿಕ್ರಿಯಾತ್ಮಕ ಚೌಕಟ್ಟುಗಳಲ್ಲಿ ಒಂದಾಗಿದೆ ಮತ್ತು ಆ ಪರಿಕಲ್ಪನೆಯು ಪ್ರಾರಂಭದಿಂದಲೂ ಭಾವಿಸಲ್ಪಡುತ್ತದೆ. ಟೆಂಪ್ಲೇಟ್ ಫೈಲ್‌ಗಳು ಅಕ್ಷರಶಃ ಹ್ಯಾಂಡಲ್‌ಬಾರ್ ಶೈಲಿಯ ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ ಇಂಟರ್‌ಪೋಲೇಷನ್‌ನೊಂದಿಗೆ HTML ಆಗಿರುತ್ತವೆ. ನೀವು Vue ಅನ್ನು ಬಳಸುತ್ತಿದ್ದರೆ, ನೀವು ನಿಮ್ಮ ಸ್ವಂತ ಬ್ಯಾಕೆಂಡ್‌ನೊಂದಿಗೆ ಕೆಲಸ ಮಾಡುತ್ತಿದ್ದೀರಿ, ಆದಾಗ್ಯೂ ನೀವು ಆ ಮಾರ್ಗದಲ್ಲಿ ಹೋಗಲು ನಿರ್ಧರಿಸಿದರೆ Nuxt Vue ಗಾಗಿ ಕಲಾ ಚೌಕಟ್ಟಿನ ಸ್ಥಿತಿಯಾಗಿದೆ.

ರಸ್ ನಮ್ಮನ್ನು Vue SSR ದಸ್ತಾವೇಜನ್ನು ಸೂಚಿಸುತ್ತಾರೆ ಮತ್ತು ನಮ್ಮ ಬ್ಲಾಗ್ ಅಪ್ಲಿಕೇಶನ್‌ನ Vue ಆವೃತ್ತಿಯ ಅನುಷ್ಠಾನಕ್ಕಾಗಿ ಮೂಲಭೂತವಾಗಿ ಅದೇ ಫೈಲ್ ರಚನೆ ಮತ್ತು ವಿನ್ಯಾಸವನ್ನು ಬಳಸಿಕೊಂಡು ಅವರ ಕೋಡ್ ತುಣುಕುಗಳು ಕಾರ್ಯನಿರ್ವಹಿಸುತ್ತವೆ. ಕೆಳಗಿನ ಸಾರಾಂಶದಲ್ಲಿ ಕೆಳಗೆ ಲಭ್ಯವಿರುವ ರಿಯಾಕ್ಟ್ ಮತ್ತು ವ್ಯೂ ಎರಡಕ್ಕೂ ಕೋಡ್ ಅನ್ನು ಹುಡುಕಿ.

ಸಂಬಂಧಿತ ಲೇಖನಗಳು

0 ಪ್ರತಿಕ್ರಿಯೆಗಳು
ಇನ್ಲೈನ್ ​​ಪ್ರತಿಕ್ರಿಯೆಗಳು
ಎಲ್ಲಾ ಕಾಮೆಂಟ್‌ಗಳನ್ನು ವೀಕ್ಷಿಸಿ
ಮೇಲಿನ ಬಟನ್ಗೆ ಹಿಂತಿರುಗಿ