Code Snippet Weekly

Useful code snippets you can use today. | 2026-06-07

ਵੱਡਾ ਖ਼ਬਰ

ਇਸ ਹਫਤੇ, Antoine Villepreux CSS ਪਾਈ ਚਾਰਟ ਬਣਾਉਣ 'ਤੇ ਨਵਾਂ ਨਜ਼ਰੀਆ ਲਿਆਂਦਾ ਹੈ ਜੋ ਜਾਵਾਸਕ੍ਰਿਪਟ 'ਤੇ ਨਿਰਭਰ ਨਹੀਂ ਹੈ। CSS ਗੁਣਾਂ ਅਤੇ ਇੱਕ ਸਮਝਦਾਰ ਅਰਥਮਈ ਢਾਂਚੇ ਦੇ ਮਿਲਾਪ ਦੀ ਵਰਤੋਂ ਕਰਕੇ, ਉਹ ਦਿਖਾਉਂਦਾ ਹੈ ਕਿ ਤੁਸੀਂ ਕਿਵੇਂ ਜਵਾਬਦਿਹ ਅਤੇ ਪਹੁੰਚਯੋਗ ਪਾਈ ਚਾਰਟ ਬਣਾਉਣਗੇ ਜੋ ਹਰ ਡਿਵਾਈਸ 'ਤੇ ਸੁਚਾਰੂ ਤਰੀਕੇ ਨਾਲ ਕੰਮ ਕਰਦੇ ਹਨ। ਇਹ ਮਹੱਤਵਪੂਰਨ ਹੈ ਕਿਉਂਕਿ ਡੇਟਾ ਵਿਜ਼ੂਅਲਾਈਜ਼ੇਸ਼ਨ ਅਕਸਰ ਜਾਵਾਸਕ੍ਰਿਪਟ 'ਤੇ ਨਿਰਭਰ ਹੁੰਦੀ ਹੈ, ਜੋ ਉਹਨਾਂ ਲਈ ਮੁਸ਼ਕਲਾਂ ਪੈਦਾ ਕਰ ਸਕਦੀ ਹੈ ਜੋ ਸਾਫ CSS ਹੱਲ ਨੂੰ ਪਸੰਦ ਕਰਦੇ ਹਨ। ਇਸ ਪਹੁੰਚ ਨਾਲ, ਤੁਸੀਂ ਆਪਣੇ ਵੈਬ ਪ੍ਰੋਜੈਕਟਾਂ ਨੂੰ ਸੁਧਾਰ ਸਕਦੇ ਹੋ ਜਦੋਂ ਕਿ ਉਨ੍ਹਾਂ ਨੂੰ ਹਲਕਾ ਅਤੇ ਸੰਭਾਲਣ ਵਿੱਚ ਆਸਾਨ ਰੱਖਦੇ ਹੋ। ਪੂਰੀ ਲੇਖ ਨੂੰ ਇੱਥੇ ਦੇਖੋ।

ਤੁਰੰਤ ਜਾਣਕਾਰੀਆਂ

CSS @custom-media: ਕੀ ਤੁਸੀਂ ਕਦੇ ਸੋਚਿਆ ਹੈ ਕਿ ਤੁਸੀਂ ਆਪਣੀਆਂ ਮੀਡੀਆ ਕੁਇਰੀਆਂ ਨੂੰ ਸਧਾਰਨ ਬਣਾ ਸਕਦੇ ਹੋ? @custom-media at-rule ਤੁਹਾਨੂੰ ਮੀਡੀਆ ਕੁਇਰੀਆਂ ਲਈ ਐਲੀਆਸ ਬਣਾਉਣ ਦੀ ਆਗਿਆ ਦਿੰਦਾ ਹੈ, ਜਿਸ ਨਾਲ ਤੁਹਾਡਾ CSS ਸਾਫ ਅਤੇ ਜ਼ਿਆਦਾ ਸੰਭਾਲਣਯੋਗ ਬਣ ਜਾਂਦਾ ਹੈ। ਇਹ ਖਾਸ ਤੌਰ 'ਤੇ ਉਪਯੋਗੀ ਹੁੰਦਾ ਹੈ ਜਦੋਂ ਤੁਹਾਡੇ ਕੋਲ ਆਪਣੇ ਸਟਾਈਲਸ਼ੀਟਾਂ ਵਿੱਚ ਕਈ ਮੀਡੀਆ ਕੁਇਰੀਆਂ ਹੁੰਦੀਆਂ ਹਨ। ਇਹ ਕਿਉਂ ਮਹੱਤਵਪੂਰਨ ਹੈ: ਇਹ ਦੁਹਰਾਉ ਨੂੰ ਘਟਾਉਂਦਾ ਹੈ, ਜੋ ਤੁਹਾਡੇ ਕੋਡ ਨੂੰ ਜ਼ਿਆਦਾ ਪ੍ਰਭਾਵਸ਼ਾਲੀ ਬਣਾਉਂਦਾ ਹੈ। ਹੋਰ ਜਾਣੋ.

CSS ਵਿੱਚ offset-path ਦੀ ਵਰਤੋਂ: ਇਹ ਗੁਣ ਤੁਹਾਨੂੰ ਐਨੀਮੇਸ਼ਨਾਂ ਦੇ ਦੌਰਾਨ ਤੱਤਾਂ ਲਈ ਇੱਕ ਗਤੀ ਪੱਥ ਭਰਣ ਦੀ ਆਗਿਆ ਦਿੰਦਾ ਹੈ। ਜਦੋਂਕਿ ਇਹ ਸ਼ਕਤੀਸ਼ਾਲੀ ਹੈ, ਸਾਰੇ ਬ੍ਰਾਉਜ਼ਰ ਇਸਨੂੰ ਪੂਰੀ ਤਰ੍ਹਾਂ ਸਮਰਥਨ ਨਹੀਂ ਕਰਦੇ, ਅਤੇ ਫਾਲਬੈਕ ਰਣਨੀਤੀਆਂ ਦੀ ਲੋੜ ਹੋ ਸਕਦੀ ਹੈ। ਇਹ ਕਿਉਂ ਮਹੱਤਵਪੂਰਨ ਹੈ: ਬ੍ਰਾਉਜ਼ਰ ਦੀ ਸੰਗਤਤਾ ਨੂੰ ਸਮਝਣਾ ਯਕੀਨੀ ਬਣਾਉਂਦਾ ਹੈ ਕਿ ਤੁਹਾਡੀਆਂ ਐਨੀਮੇਸ਼ਨਾਂ ਸਾਰੀਆਂ ਪਲੈਟਫਾਰਮਾਂ 'ਤੇ ਸੁਚਾਰੂ ਤਰੀਕੇ ਨਾਲ ਚੱਲਦੀਆਂ ਹਨ। ਇਸ ਬਾਰੇ ਪੜ੍ਹੋ.

Astro Markdown Component Utility: ਜੇ ਤੁਸੀਂ ਵੱਖ-ਵੱਖ ਫਰੇਮਵਰਕਾਂ ਵਿੱਚ Markdown 'ਤੇ ਕੰਮ ਕਰ ਰਹੇ ਹੋ, ਤਾਂ ਇਹ ਯੂਟਿਲਿਟੀ ਤੁਹਾਡੇ ਕੰਮ ਦੇ ਪ੍ਰਵਾਹ ਨੂੰ ਸਧਾਰਨ ਬਣਾ ਸਕਦੀ ਹੈ। ਇਹ ਤੁਹਾਨੂੰ ਪਲੇਟਫਾਰਮਾਂ ਵਿੱਚ ਸੁਚਾਰੂ ਤਰੀਕੇ ਨਾਲ Markdown ਕੰਪੋਨੈਂਟਾਂ ਦੀ ਵਰਤੋਂ ਕਰਨ ਦੀ ਆਗਿਆ ਦਿੰਦੀ ਹੈ, ਜਿਸ ਨਾਲ ਤੁਹਾਡੇ ਸਮਾਂ ਅਤੇ ਮਿਹਨਤ ਬਚਦੀ ਹੈ। ਇਹ ਕਿਉਂ ਮਹੱਤਵਪੂਰਨ ਹੈ: ਇੱਕ ਸਥਿਰ Markdown ਅਨੁਭਵ ਤੁਹਾਡੀ ਉਤਪਾਦਕਤਾ ਨੂੰ ਵਧਾਉਂਦਾ ਹੈ। ਇਸਨੂੰ ਦੇਖੋ.

SQL ਕੁਇਰੀ ਟਿਊਨਿੰਗ ਪਲੇਬੁੱਕ: ਜੇ ਤੁਸੀਂ ਆਪਣੇ ਡੇਟਾਬੇਸ ਕੁਇਰੀਆਂ ਨੂੰ ਤੇਜ਼ ਕਰਨਾ ਚਾਹੁੰਦੇ ਹੋ, ਤਾਂ ਇਹ ਅਮਲੀ ਗਾਈਡ ਕਾਰਜਨਵਿਤੀ ਯੋਜਨਾਵਾਂ, ਜੋੜਾਂ, ਅਤੇ ਇੰਡੈਕਸਿੰਗ ਬਾਰੇ ਜਾਣਕਾਰੀਆਂ ਪ੍ਰਦਾਨ ਕਰਦੀ ਹੈ। ਇਹ ਹਕੀਕਤ ਵਿੱਚ ਅਨੁਭਵਾਂ 'ਤੇ ਆਧਾਰਿਤ ਹੈ, ਜਿਸਦਾ ਮਤਲਬ ਹੈ ਕਿ ਇਹ ਸਿਰਫ ਸਿਧਾਂਤ ਨਹੀਂ ਬਲਕਿ ਕਾਰਵਾਈਯੋਗ ਸੁਝਾਅ ਹੈ। ਇਹ ਕਿਉਂ ਮਹੱਤਵਪੂਰਨ ਹੈ: ਆਪਣੇ SQL ਕੁਇਰੀਆਂ ਨੂੰ ਵਧੀਆ ਕਰਨਾ ਐਪਲੀਕੇਸ਼ਨ ਦੇ ਪ੍ਰਦਰਸ਼ਨ ਨੂੰ ਮਹੱਤਵਪੂਰਨ ਤੌਰ 'ਤੇ ਸੁਧਾਰ ਸਕਦਾ ਹੈ। ਵਿਸਥਾਰ ਵਿੱਚ ਜਾਓ.

ਗਾਹਕ ਸਾਈਟਾਂ ਨੂੰ ਜਲਦੀ ਬਣਾਉਣਾ: ਇੱਕ ਹਾਲੀਆ ਕੇਸ ਅਧਿਐਨ ਇਹ ਦਿਖਾਉਂਦਾ ਹੈ ਕਿ ਕਿਵੇਂ ਇੱਕ ਛੋਟੀ ਪੇਸ਼ੇਵਰ ਸੇਵਾ ਕੰਪਨੀ ਨੇ AI ਟੂਲ ਅਤੇ CMS ਦੀ ਵਰਤੋਂ ਕਰਕੇ ਸਿਰਫ ਇੱਕ ਦੁਪਹਿਰ ਵਿੱਚ ਇੱਕ ਗਾਹਕ ਸਾਈਟ ਬਣਾਈ। ਇਹ ਤੇਜ਼ ਵਿਕਾਸ ਆਧੁਨਿਕ ਟੂਲਾਂ ਦੀ ਸੰਭਾਵਨਾ ਨੂੰ ਦਰਸਾਉਂਦਾ ਹੈ। ਇਹ ਕਿਉਂ ਮਹੱਤਵਪੂਰਨ ਹੈ: ਇਹ ਦਿਖਾਉਂਦਾ ਹੈ ਕਿ ਵੈਬ ਵਿਕਾਸ ਵਿੱਚ ਕਿਵੇਂ ਪ੍ਰਭਾਵਸ਼ਾਲੀਤਾ ਪ੍ਰਾਪਤ ਕੀਤੀ ਜਾ ਸਕਦੀ ਹੈ, ਖ਼ਾਸ ਕਰਕੇ ਜਦੋਂ ਸਮਾਂ ਪਾਬੰਦੀਆਂ ਹੋਣ। ਹੋਰ ਪੜ੍ਹੋ.

ਇੱਕ ਚੀਜ਼ ਅਜ਼ਮਾਉਣ ਲਈ

ਇਸ ਹਫਤੇ, ਆਪਣੇ ਪ੍ਰੋਜੈਕਟਾਂ ਵਿੱਚ CSS @custom-media ਫੀਚਰ ਨੂੰ ਲਾਗੂ ਕਰਨ ਦੀ ਕੋਸ਼ਿਸ਼ ਕਰੋ। ਮੀਡੀਆ ਕੁਇਰੀ ਐਲੀਆਸ ਨੂੰ ਪਰਿਭਾਸ਼ਿਤ ਕਰੋ ਤਾਂ ਕਿ ਤੁਹਾਡੇ ਸਟਾਈਲਸ਼ੀਟਾਂ ਨੂੰ ਸਧਾਰਨ ਬਣਾਇਆ ਜਾ ਸਕੇ ਅਤੇ ਇਹਨਾਂ ਨੂੰ ਵਧੇਰੇ ਸੰਭਾਲਣਯੋਗ ਬਣਾਇਆ ਜਾ ਸਕੇ। ਤੁਸੀਂ ਦੇਖੋਗੇ ਕਿ ਤੁਹਾਡਾ CSS ਕਿੰਨਾ ਸਾਫ਼ ਹੁੰਦਾ ਹੈ!

ਸਾਇਨ-ਆਫ

ਮੈਂ ਉਮੀਦ ਕਰਦਾ ਹਾਂ ਕਿ ਤੁਹਾਨੂੰ ਇਹ ਟੁਕੜੇ ਲਾਭਦਾਇਕ ਲੱਗਦੇ ਹਨ! ਜੇ ਤੁਹਾਡੇ ਕੋਲ ਕੋਈ ਸਵਾਲ ਹਨ ਜਾਂ ਤੁਸੀਂ ਆਪਣੇ ਸੁਝਾਅ ਸਾਂਝੇ ਕਰਨਾ ਚਾਹੁੰਦੇ ਹੋ, ਤਾਂ ਬੇਝਿਜਕ ਜਵਾਬ ਦਿਓ। ਕੋਡਿੰਗ ਕਰਦੇ ਰਹੋ!

More from FreshSift:

Get this in your inbox every week

Subscribe for Free →