ਮੈਂ ਅਣਜਾਣੇ ਵਿੱਚ ਹੀ Vue.js ਦੀ ਵਰਤੋਂ ਕਰਨ ਲੱਗ ਪਿਆ ਸੀ। ਹਰ ਪ੍ਰੋਜੈਕਟ ਇੱਕੋ ਤਰੀਕੇ ਨਾਲ ਸ਼ੁਰੂ ਹੁੰਦਾ ਸੀ: CLI ਇੰਸਟਾਲ ਕਰੋ, ਰੂਟਰ ਸੈੱਟਅੱਪ ਕਰੋ, ਸਟੋਰ ਕੌਂਫਿਗਰ ਕਰੋ, ਅਤੇ ਪੂਰੀ ਚੀਜ਼ ਨੂੰ ਇੱਕ single-page application shell ਵਿੱਚ ਲਪੇਟ ਦਿਓ। ਇਸ ਨਾਲ ਕੋਈ ਫਰਕ ਨਹੀਂ ਪੈਂਦਾ ਸੀ ਕਿ ਮੈਂ ਇੱਕ real-time dashboard ਬਣਾ ਰਿਹਾ ਸੀ ਜਾਂ ਇੱਕ ਸਧਾਰਨ contact form। Vue ਮੇਰਾ ਡਿਫੌਲਟ ਸੀ, ਅਤੇ ਮੈਂ ਮੰਨਦਾ ਸੀ ਕਿ ਕੁਝ ਵੀ ਹਲਕਾ ਹੋਣਾ ਇੱਕ ਕਦਮ ਪਿੱਛੇ ਜਾਣਾ ਹੈ।
ਇਹ ਆਦਤ ਆਮ ਹੈ। ਜੇਕਰ ਤੁਸੀਂ React ਜਾਂ Vue ecosystem ਵਿੱਚ ਸਾਲ ਬਿਤਾਏ ਹਨ, ਤਾਂ SPA ਮਾਡਲ ਲਾਜ਼ਮੀ ਮਹਿਸੂਸ ਹੋਣ ਲੱਗਦਾ ਹੈ। ਤੁਸੀਂ ਇਹ ਪੁੱਛਣਾ ਬੰਦ ਕਰ ਦਿੰਦੇ ਹੋ ਕਿ ਕੀ ਤੁਹਾਨੂੰ ਅਸਲ ਵਿੱਚ ਇੰਨੀ ਜ਼ਿਆਦਾ ਮਸ਼ੀਨਰੀ ਦੀ ਲੋੜ ਹੈ। ਤੁਸੀਂ ਬੱਸ ਇਸਦੀ ਵਰਤੋਂ ਕਰਨ ਲੱਗ ਜਾਂਦੇ ਹੋ। ਸਮੇਂ ਦੇ ਨਾਲ, ਮੈਂ ਕੁਝ ਚਿੰਤਾਜਨਕ ਨੋਟ ਕੀਤਾ। ਮੈਂ ਉਹਨਾਂ admin screens ਲਈ Vuex stores ਤਿਆਰ ਕਰ ਰਿਹਾ ਸੀ ਜਿਨ੍ਹਾਂ ਨੂੰ ਸਿਰਫ਼ ਇੱਕ ਸਟੇਟਸ ਨੂੰ ਬਦਲਣ (toggle) ਅਤੇ ਇੱਕ ਟੇਬਲ ਨੂੰ ਰਿਫ੍ਰੈਸ਼ ਕਰਨ ਦੀ ਲੋੜ ਸੀ। ਮੈਂ ਉਹਨਾਂ landing pages ਲਈ fetch logic ਬਣਾ ਰਿਹਾ ਸੀ ਜਿਨ੍ਹਾਂ ਨੂੰ ਸਿਰਫ਼ ਇੱਕ ਈਮੇਲ ਐਡਰੈੱਸ ਸਬਮਿਟ ਕਰਨ ਦੀ ਲੋੜ ਸੀ। ਗੁੰਝਲਦਾਰਤਾ ਸਮੱਸਿਆਵਾਂ ਤੋਂ ਨਹੀਂ ਆ ਰਹੀ ਸੀ। ਇਹ ਮੇਰੇ ਟੂਲ ਦੀ ਚੋਣ ਤੋਂ ਆ ਰਹੀ ਸੀ।
ਫਿਰ ਮੈਂ HTMX ਦੀ ਵਰਤੋਂ ਕਰਨੀ ਸ਼ੁਰੂ ਕੀਤੀ। ਇਹ ਬਦਲਾਅ ਮੇਰੀ ਉਮੀਦ ਤੋਂ ਕਿਤੇ ਜ਼ਿਆਦਾ ਸ਼ਾਂਤ ਸੀ, ਪਰ ਇਸਨੇ ਮੇਰੇ ਸਟੈਕ (stack) ਦੀ ਚੋਣ ਕਰਨ ਦੇ ਤਰੀਕੇ ਨੂੰ ਬਦਲ ਦਿੱਤਾ।
HTMX ਅਸਲ ਵਿੱਚ ਕੀ ਕਰਦਾ ਹੈ
ਜ਼ਿਆਦਾਤਰ ਆਨਲਾਈਨ ਚਰਚਾਵਾਂ ਇਸ ਨੂੰ ਗਲਤ ਸਮਝਦੀਆਂ ਹਨ। ਲੋਕ ਇਸ ਨੂੰ Vue ਬਨਾਮ React ਬਨਾਮ HTMX ਦੀ ਲੜਾਈ ਵਜੋਂ ਪੇਸ਼ ਕਰਦੇ ਹਨ। ਉਹ ਤੁਲਨਾ ਪੂਰੀ ਤਰ੍ਹਾਂ ਗਲਤ ਹੈ। HTMX ਕੋਈ SPA framework ਨਹੀਂ ਹੈ। ਇਹ Vue ਦੀ ਜਗ੍ਹਾ ਨਹੀਂ ਲੈਣਾ ਚਾਹੁੰਦਾ। ਇਹ ਇੱਕ ਅਜਿਹੀ library ਹੈ ਜੋ HTML ਨੂੰ ਉਹ ਕੰਮ ਕਰਨ ਦੇ ਯੋਗ ਬਣਾਉਂਦੀ ਹੈ ਜੋ ਬ੍ਰਾਊਜ਼ਰ ਆਮ ਤੌਰ 'ਤੇ ਨਹੀਂ ਕਰ ਸਕਦਾ।
ਇੱਕ ਅਜਿਹਾ component ਲਿਖਣ ਦੀ ਬਜਾਏ ਜੋ mount ਹੁੰਦਾ ਹੈ, JSON fetch ਕਰਦਾ ਹੈ, ਉਸਨੂੰ local state ਵਿੱਚ parse ਕਰਦਾ ਹੈ, ਅਤੇ ਇੱਕ list ਨੂੰ re-render ਕਰਦਾ ਹੈ, ਤੁਸੀਂ ਬੱਸ ਇੱਕ ਬਟਨ ਵਿੱਚ ਇੱਕ attribute ਜੋੜ ਦਿੰਦੇ ਹੋ। ਸਰਵਰ HTML fragments ਵਾਪਸ ਕਰਦਾ ਹੈ, ਨਾ ਕਿ data payloads। ਬ੍ਰਾਊਜ਼ਰ ਉਸ content ਨੂੰ ਸਹੀ ਜਗ੍ਹਾ 'ਤੇ ਬਦਲ (swap) ਦਿੰਦਾ ਹੈ। ਤੁਸੀਂ ਅਜੇ ਵੀ server-rendered pages ਨਾਲ ਕੰਮ ਕਰ ਰਹੇ ਹੋ, ਪਰ ਤੁਹ