ਤੁਹਾਡੇ ਕੋਲ ਇੱਕ ਡਿਜ਼ਾਈਨ ਅਤੇ ਇੱਕ ਬੈਕਐਂਡ ਹੈ, ਅਤੇ ਤੁਹਾਨੂੰ ਉਹ ਹਿੱਸਾ ਚਾਹੀਦਾ ਹੈ ਜੋ ਉਪਭੋਗਤਾ ਅਸਲ ਵਿੱਚ ਦੇਖਦੇ ਹਨ। ਮੈਂ Figma ਸਕ੍ਰੀਨਾਂ ਨੂੰ TypeScript ਵਿੱਚ ਇੱਕ React ਜਾਂ Next.js ਫਰੰਟ ਐਂਡ ਵਿੱਚ ਬਦਲਦਾ ਹਾਂ, ਜੋ ਫ਼ੋਨ ਤੋਂ ਡੈਸਕਟਾਪ ਤੱਕ ਜਵਾਬਦੇਹ ਹੁੰਦਾ ਹੈ, ਅਤੇ ਇਸਨੂੰ ਤੁਹਾਡੀ API ਨਾਲ ਲੋਡਿੰਗ, ਖਾਲੀ ਅਤੇ ਗਲਤੀ ਸਥਿਤੀਆਂ ਨੂੰ ਸੰਭਾਲਦੇ ਹੋਏ ਕਨੈਕਟ ਕਰਦਾ ਹਾਂ।
ਮੈਂ ਤੁਹਾਡੇ React ਜਾਂ Next.js ਫਰੰਟ ਐਂਡ ਨੂੰ ਇੱਕ Figma ਡਿਜ਼ਾਈਨ ਤੋਂ ਬਣਾਵਾਂਗਾ ਅਤੇ ਇਸਨੂੰ ਤੁਹਾਡੀ API ਨਾਲ ਕਨੈਕਟ ਕਰਾਂਗਾ
ਤੁਹਾਡੀ ਫਿਗਮਾ ਫਾਈਲ ਤੋਂ ਇੱਕ ਸਕ੍ਰੀਨ, ਜਵਾਬਦੇਹ, ਟਾਈਪ ਕੀਤੀ ਗਈ ਅਤੇ ਤੁਹਾਡੀ API ਨਾਲ ਕਨੈਕਟ ਕੀਤੀ ਗਈ।
- ਇੱਕ ਸਕ੍ਰੀਨ
- ਜਵਾਬਦੇਹ ਡਿਜ਼ਾਈਨ
- ਤੁਹਾਡੀ API ਨਾਲ ਕਨੈਕਟ ਕੀਤਾ ਗਿਆ
- ਸਰੋਤ ਕੋਡ
ਤੁਹਾਡੀ API ਨਾਲ 5 ਸਕ੍ਰੀਨਾਂ ਤੱਕ ਵਾਇਰਡ, ਲੋਡਿੰਗ, ਖਾਲੀ ਅਤੇ ਗਲਤੀ ਸਥਿਤੀਆਂ ਦੇ ਨਾਲ।
- 5 ਸਕ੍ਰੀਨਾਂ ਤੱਕ
- ਜਵਾਬਦੇਹ ਡਿਜ਼ਾਈਨ
- ਤੁਹਾਡੀ API ਨਾਲ ਕਨੈਕਟ ਕੀਤਾ ਗਿਆ
- ਸਰੋਤ ਕੋਡ
12 ਸਕ੍ਰੀਨਾਂ ਤੱਕ, ਤੁਹਾਡੀ ਪ੍ਰਮਾਣਿਕਤਾ ਦੇ ਵਿਰੁੱਧ ਲੌਗਇਨ, ਸਾਂਝੇ ਭਾਗ ਅਤੇ ਟੈਸਟ।
- 12 ਸਕ੍ਰੀਨਾਂ ਤੱਕ, ਲੌਗਇਨ, ਟੈਸਟ
- ਜਵਾਬਦੇਹ ਡਿਜ਼ਾਈਨ
- ਤੁਹਾਡੀ API ਨਾਲ ਕਨੈਕਟ ਕੀਤਾ ਗਿਆ
- ਸਰੋਤ ਕੋਡ
ਇੱਕ ਕਸਟਮ ਪੇਸ਼ਕਸ਼ ਦੀ ਬੇਨਤੀ ਕਰੋ
ਕਸਟਮ ਪੇਸ਼ਕਸ਼ ਦੀ ਬੇਨਤੀ ਕਰਨ ਲਈ ਲੌਗ ਇਨ ਕਰੋ
ਇਸ Zinner ਤੋਂ ਇੱਕ ਵਿਅਕਤੀਗਤ ਪੇਸ਼ਕਸ਼ ਦੀ ਬੇਨਤੀ ਕਰਨ ਲਈ ਇੱਕ ਮੁਫਤ ਖਾਤਾ ਬਣਾਓ ਜਾਂ ਲੌਗ ਇਨ ਕਰੋ।
ਲੌਗ ਇਨ / ਰਜਿਸਟਰ ਕਰੋਵਿਕਰੀ ਤੋਂ ਪਹਿਲਾਂ ਦਾ ਸਵਾਲ ਪੁੱਛੋ
ਸਵਾਲ ਪੁੱਛਣ ਲਈ ਲੌਗ ਇਨ ਕਰੋ
ਪਲੇਟਫਾਰਮ ਸਪੈਮ ਨੂੰ ਘਟਾਉਣ ਲਈ, ਪ੍ਰੀ-ਸੇਲ ਸੁਨੇਹੇ ਸਿਰਫ਼ ਲੌਗ-ਇਨ ਕੀਤੇ ਉਪਭੋਗਤਾਵਾਂ ਦੁਆਰਾ ਹੀ ਭੇਜੇ ਜਾ ਸਕਦੇ ਹਨ।
ਇਸ Zinner ਨੂੰ ਸਿੱਧਾ ਸੁਨੇਹਾ ਭੇਜਣ ਲਈ ਇੱਕ ਮੁਫ਼ਤ ਖਾਤਾ ਬਣਾਓ ਜਾਂ ਲੌਗ ਇਨ ਕਰੋ।
ਲੌਗ ਇਨ / ਰਜਿਸਟਰ ਕਰੋਲੌਗ ਇਨ ਕਰਨਾ ਜ਼ਰੂਰੀ ਹੈ
ਇਸ Zinner ਨੂੰ ਸੁਨੇਹਾ ਭੇਜਣ ਲਈ ਇੱਕ ਮੁਫਤ ਖਾਤਾ ਬਣਾਓ ਜਾਂ ਲੌਗ ਇਨ ਕਰੋ।
ਲੌਗ ਇਨ / ਰਜਿਸਟਰ ਕਰੋਲੌਗ ਇਨ ਕਰਨਾ ਜ਼ਰੂਰੀ ਹੈ
ਇੱਕ ਵਿਅਕਤੀਗਤ ਪੇਸ਼ਕਸ਼ ਦੀ ਬੇਨਤੀ ਕਰਨ ਲਈ ਇੱਕ ਮੁਫਤ ਖਾਤਾ ਬਣਾਓ ਜਾਂ ਲੌਗ ਇਨ ਕਰੋ।
ਲੌਗ ਇਨ / ਰਜਿਸਟਰ ਕਰੋਇੱਕ ਨਜ਼ਰ ਵਿੱਚ
ਤੁਹਾਡੇ ਫੈਸਲੇ ਲੈਣ ਵਿੱਚ ਮਦਦ ਕਰਨ ਲਈ ਇਸ ਸੇਵਾ ਬਾਰੇ ਮੁੱਖ ਵੇਰਵੇ। Zinn Hub ਦੁਆਰਾ ਤਿਆਰ ਕੀਤਾ ਗਿਆ, ਵਿਕਰੇਤਾ ਦੁਆਰਾ ਨਹੀਂ।
ਮੁੱਲ ਸਥਿਤੀ
ਤਕਨੀਕੀ ਸਟੈਕ
ਜਵਾਬਦੇਹ ਅਤੇ ਕਰਾਸ-ਬ੍ਰਾਊਜ਼ਰ
API ਏਕੀਕਰਨ
ਸਹਾਇਤਾ ਅਵਧੀ
ਤੁਹਾਨੂੰ ਕੀ ਮਿਲੇਗਾ
ਪੂਰਾ ਵੇਰਵਾ
ਡਿਜ਼ਾਈਨ ਹੋ ਗਿਆ ਹੈ ਅਤੇ API ਤਿਆਰ ਹੈ ਜਾਂ ਲਗਭਗ ਤਿਆਰ ਹੈ, ਪਰ ਉਪਭੋਗਤਾਵਾਂ ਨੂੰ ਜੋ ਸਕ੍ਰੀਨਾਂ ਦਿਖਾਈ ਦੇਣਗੀਆਂ ਉਹ ਅਜੇ ਮੌਜੂਦ ਨਹੀਂ ਹਨ। ਮੈਂ ਸਿਰਫ ਫਰੰਟ ਐਂਡ ਬਣਾਉਂਦਾ ਹਾਂ: ਤੁਹਾਡਾ ਬੈਕਐਂਡ, ਪ੍ਰਮਾਣਿਕਤਾ ਪ੍ਰਦਾਤਾ ਅਤੇ ਹੋਸਟਿੰਗ ਜਿਵੇਂ ਹਨ ਉਵੇਂ ਹੀ ਰਹਿੰਦੇ ਹਨ, ਅਤੇ ਕੋਡ ਤੁਹਾਡੇ ਰਿਪੋਜ਼ਟਰੀ ਵਿੱਚ ਜਾਂਦਾ ਹੈ। ਡਿਲੀਵਰੀ ਤੋਂ ਬਾਅਦ 14 ਦਿਨਾਂ ਲਈ, ਮੈਂ ਉਹ ਸਭ ਕੁਝ ਠੀਕ ਕਰਦਾ ਹਾਂ ਜੋ ਸਾਡੇ ਦੁਆਰਾ ਸਹਿਮਤੀ ਅਨੁਸਾਰ ਕੰਮ ਨਹੀਂ ਕਰਦਾ, ਮੁਫਤ।
ਸਟਾਰਟਰ ਦੇ ਨਾਲ ਤੁਹਾਨੂੰ ਤੁਹਾਡੀ ਫਿਗਮਾ ਫਾਈਲ ਤੋਂ ਇੱਕ ਸਕ੍ਰੀਨ ਜਾਂ ਪੰਨਾ ਮਿਲਦਾ ਹੈ, ਜਵਾਬਦੇਹ ਅਤੇ ਟਾਈਪ ਕੀਤਾ ਗਿਆ, ਜਿਸਦਾ ਡੇਟਾ ਤੁਹਾਡੀ API ਤੋਂ ਆਉਂਦਾ ਹੈ, ਜਾਂ ਇੱਕ ਮੌਕ ਤੋਂ ਜਦੋਂ ਤੱਕ ਐਂਡਪੁਆਇੰਟ ਮੌਜੂਦ ਨਹੀਂ ਹੁੰਦਾ। ਸਟੈਂਡਰਡ ਤੁਹਾਡੀ API ਨਾਲ ਜੁੜੀਆਂ ਪੰਜ ਸਕ੍ਰੀਨਾਂ ਤੱਕ ਕਵਰ ਕਰਦਾ ਹੈ, ਲੋਡਿੰਗ, ਖਾਲੀ ਅਤੇ ਗਲਤੀ ਸਥਿਤੀਆਂ ਅਤੇ ਪ੍ਰਮਾਣਿਕਤਾ ਵਾਲੇ ਫਾਰਮਾਂ ਦੇ ਨਾਲ। ਐਡਵਾਂਸਡ ਬਾਰਾਂ ਸਕ੍ਰੀਨਾਂ ਤੱਕ ਦੀ ਇਜਾਜ਼ਤ ਦਿੰਦਾ ਹੈ ਅਤੇ ਲੌਗਇਨ ਸਕ੍ਰੀਨਾਂ ਜੋੜਦਾ ਹੈ ਜੋ ਤੁਹਾਡੇ ਪ੍ਰਮਾਣਿਕਤਾ ਪ੍ਰਦਾਤਾ, ਐਪ ਵਿੱਚ ਵਰਤੇ ਗਏ ਸਾਂਝੇ ਭਾਗਾਂ, ਅਤੇ ਮੁੱਖ ਪ੍ਰਵਾਹਾਂ ਲਈ ਟੈਸਟਾਂ ਨਾਲ ਕੰਮ ਕਰਦੀਆਂ ਹਨ।
ਮੈਂ ਡਿਜ਼ਾਈਨ ਦੀ ਨੇੜਿਓਂ ਪਾਲਣਾ ਕਰਦਾ ਹਾਂ: ਸਪੇਸਿੰਗ, ਟਾਈਪ ਸਕੇਲ ਅਤੇ ਰੰਗ ਫਿਗਮਾ ਫਾਈਲ ਤੋਂ ਆਉਂਦੇ ਹਨ। ਜਿੱਥੇ ਇੱਕ ਸਕ੍ਰੀਨ ਦਾ ਕੋਈ ਮੋਬਾਈਲ ਸੰਸਕਰਣ ਨਹੀਂ ਹੈ, ਮੈਂ ਇਸਨੂੰ ਬਣਾਉਣ ਤੋਂ ਪਹਿਲਾਂ ਇੱਕ ਦਾ ਪ੍ਰਸਤਾਵ ਕਰਦਾ ਹਾਂ ਅਨੁਮਾਨ ਲਗਾਉਣ ਦੀ ਬਜਾਏ। ਐਪ ਰਾਊਟਰ ਦੇ ਨਾਲ ਨੈਕਸਟ.ਜੇਐਸ ਮੇਰਾ ਡਿਫੌਲਟ ਹੈ; ਜਦੋਂ ਤੁਹਾਨੂੰ ਸਰਵਰ ਰੈਂਡਰਿੰਗ ਦੀ ਲੋੜ ਨਹੀਂ ਹੁੰਦੀ ਤਾਂ Vite ਦੇ ਨਾਲ ਸਾਦਾ ਰੀਐਕਟ ਠੀਕ ਹੈ। ਸਟਾਈਲਿੰਗ ਲਈ ਮੈਂ ਟੇਲਵਿੰਡ CSS ਜਾਂ CSS ਮੋਡਿਊਲ ਦੀ ਵਰਤੋਂ ਕਰਦਾ ਹਾਂ, ਜੋ ਵੀ ਤੁਹਾਡੇ ਪ੍ਰੋਜੈਕਟ ਵਿੱਚ ਪਹਿਲਾਂ ਹੀ ਹੈ।
ਮੈਂ ਡੈਸਕਟਾਪ 'ਤੇ ਕ੍ਰੋਮ, ਫਾਇਰਫਾਕਸ ਅਤੇ ਐਜ ਵਿੱਚ, ਅਤੇ ਇੱਕ ਅਸਲ ਐਂਡਰਾਇਡ ਫੋਨ 'ਤੇ ਕ੍ਰੋਮ ਵਿੱਚ ਨਤੀਜੇ ਦੀ ਜਾਂਚ ਕਰਦਾ ਹਾਂ।
ਮੇਰੇ ਫਰੰਟ-ਐਂਡ ਕੰਮ ਦੀਆਂ ਦੋ ਜਨਤਕ ਉਦਾਹਰਣਾਂ ਪੋਰਟਫੋਲੀਓ ਵਿੱਚ ਹਨ: ਫਿਲਟਰਾਂ, ਇੱਕ ਕਾਰਟ ਅਤੇ ਇੱਕ ਚੈਕਆਉਟ ਦੇ ਨਾਲ ਇੱਕ ਨੈਕਸਟ.ਜੇਐਸ ਸਟੋਰਫਰੰਟ, ਅਤੇ ਮੇਰੀ ਆਪਣੀ ਦੋਭਾਸ਼ੀ ਸਾਈਟ।
ਮੈਂ ਸਿਰਫ ਲਿਖਤੀ ਰੂਪ ਵਿੱਚ ਕੰਮ ਕਰਦਾ ਹਾਂ, ਬਿਨਾਂ ਮੀਟਿੰਗਾਂ ਦੇ। ਸਕ੍ਰੀਨਾਂ ਅਤੇ ਉਹਨਾਂ ਦੇ ਪਿੱਛੇ ਦੇ ਐਂਡਪੁਆਇੰਟ ਮੇਰੇ ਸ਼ੁਰੂ ਕਰਨ ਤੋਂ ਪਹਿਲਾਂ ਸੂਚੀਬੱਧ ਕੀਤੇ ਜਾਂਦੇ ਹਨ, ਇੱਕ ਪੂਰਵਦਰਸ਼ਨ ਲਿੰਕ ਕੰਮ ਨੂੰ ਵਧਦਾ ਹੋਇਆ ਦਿਖਾਉਂਦਾ ਹੈ, ਅਤੇ ਹਰ ਕੰਮ ਵਾਲੇ ਦਿਨ ਚੈਟ ਵਿੱਚ ਇੱਕ ਛੋਟਾ ਪ੍ਰਗਤੀ ਨੋਟ ਆਉਂਦਾ ਹੈ।
ਆਪਣੇ ਪ੍ਰੋਜੈਕਟ ਨੂੰ ਪੂਰਾ ਕਰਨ ਲਈ ਕਦਮ
1. ਸਕ੍ਰੀਨ ਸੂਚੀ - ਮੈਂ ਫਿਗਮਾ ਫਾਈਲ ਅਤੇ ਤੁਹਾਡੇ API ਦਸਤਾਵੇਜ਼ਾਂ ਵਿੱਚੋਂ ਲੰਘਦਾ ਹਾਂ ਅਤੇ ਹਰੇਕ ਸਕ੍ਰੀਨ, ਇਸਦੀਆਂ ਸਥਿਤੀਆਂ ਅਤੇ ਉਹਨਾਂ ਅੰਤਮ ਬਿੰਦੂਆਂ ਨੂੰ ਲਿਖਦਾ ਹਾਂ ਜਿਨ੍ਹਾਂ ਨੂੰ ਇਹ ਕਾਲ ਕਰਦਾ ਹੈ। ਤੁਸੀਂ ਕਿਸੇ ਵੀ ਕੋਡ ਤੋਂ ਪਹਿਲਾਂ ਸੂਚੀ ਦੀ ਪੁਸ਼ਟੀ ਕਰਦੇ ਹੋ।
2. ਬੇਸ ਅਤੇ ਸਾਂਝੇ ਹਿੱਸੇ - ਪ੍ਰੋਜੈਕਟ ਸੈੱਟਅੱਪ ਜਾਂ ਤੁਹਾਡਾ ਮੌਜੂਦਾ ਰਿਪੋਜ਼ਟਰੀ, ਫਿਗਮਾ ਤੋਂ ਰੰਗ ਅਤੇ ਕਿਸਮ, ਅਤੇ ਲੇਆਉਟ ਅਤੇ ਕੰਪੋਨੈਂਟ ਜੋ ਹਰ ਸਕ੍ਰੀਨ ਦੁਬਾਰਾ ਵਰਤਦੀ ਹੈ।
3. ਸਕ੍ਰੀਨਾਂ ਅਤੇ ਡੇਟਾ - ਹਰੇਕ ਸਕ੍ਰੀਨ ਨੂੰ ਡਿਜ਼ਾਈਨ ਅਨੁਸਾਰ ਬਣਾਇਆ ਜਾਂਦਾ ਹੈ ਅਤੇ ਤੁਹਾਡੇ API ਨਾਲ ਕਨੈਕਟ ਕੀਤਾ ਜਾਂਦਾ ਹੈ, ਜਿਸ ਵਿੱਚ ਲੋਡਿੰਗ, ਖਾਲੀ ਅਤੇ ਗਲਤੀ ਸਥਿਤੀਆਂ ਸ਼ਾਮਲ ਹੁੰਦੀਆਂ ਹਨ। ਇੱਕ ਗੁੰਮ ਹੋਏ ਅੰਤਮ ਬਿੰਦੂ ਨੂੰ ਇੱਕ ਮੌਕ ਮਿਲਦਾ ਹੈ ਜਿਸਨੂੰ ਬਦਲਣਾ ਆਸਾਨ ਹੁੰਦਾ ਹੈ।
4. ਪ੍ਰੀਵਿਊ ਲਿੰਕ 'ਤੇ ਸਮੀਖਿਆ ਦੌਰ - ਤੁਸੀਂ ਕਲਿੱਕ ਕਰਦੇ ਹੋ ਅਤੇ ਇੱਕ ਸੂਚੀ ਵਿੱਚ ਸੁਧਾਰ ਭੇਜਦੇ ਹੋ। ਮੈਂ ਉਹਨਾਂ ਨੂੰ ਠੀਕ ਕਰਦਾ ਹਾਂ ਅਤੇ ਉਹੀ ਲਿੰਕ ਦੁਬਾਰਾ ਦਿਖਾਉਂਦਾ ਹਾਂ।
5. ਹੈਂਡਓਵਰ - ਤੁਹਾਡੀ ਰਿਪੋਜ਼ਟਰੀ ਵਿੱਚ ਕੋਡ, ਬਣਤਰ ਅਤੇ ਇਸਨੂੰ ਕਿਵੇਂ ਚਲਾਉਣਾ ਹੈ ਬਾਰੇ ਇੱਕ ਛੋਟਾ ਨੋਟ, ਅਤੇ ਐਡਵਾਂਸਡ 'ਤੇ, ਟੈਸਟ ਜੋ ਤੁਸੀਂ ਹਰੇਕ ਰੀਲੀਜ਼ ਤੋਂ ਪਹਿਲਾਂ ਚਲਾ ਸਕਦੇ ਹੋ।
Zinner ਗੁਣਵੱਤਾ ਗਾਰੰਟੀ
ਹਰ Zinner ਨੂੰ ਪਲੇਟਫਾਰਮ ਵਿੱਚ ਸ਼ਾਮਲ ਹੋਣ ਤੋਂ ਪਹਿਲਾਂ ਸਮੀਖਿਆ ਅਤੇ ਪ੍ਰਵਾਨਿਤ ਕੀਤਾ ਜਾਂਦਾ ਹੈ।
ਸਾਰੀਆਂ ਸੇਵਾਵਾਂ ਸਾਡੀ ਗੁਣਵੱਤਾ ਭਰੋਸਾ ਪ੍ਰਤੀਬੱਧਤਾ ਦੁਆਰਾ ਸਮਰਥਿਤ ਹਨ।
ਤੁਹਾਡਾ ਭੁਗਤਾਨ ਉਦੋਂ ਤੱਕ ਸੁਰੱਖਿਅਤ ਹੈ ਜਦੋਂ ਤੱਕ ਤੁਸੀਂ ਡਿਲੀਵਰ ਕੀਤੇ ਕੰਮ ਨੂੰ ਮਨਜ਼ੂਰੀ ਨਹੀਂ ਦਿੰਦੇ।
ਪੈਕੇਜਾਂ ਦੀ ਤੁਲਨਾ ਕਰੋ
| ਫੰਕਸ਼ਨ | ਸਟਾਰਟਰ | ਮਿਆਰੀ | ਐਡਵਾਂਸਡ |
|---|---|---|---|
| ਡਿਲੀਵਰੀ ਸਮਾਂ | 4 ਦਿਨ | 9 ਦਿਨ | 18 ਦਿਨ |
| ਸੋਧਾਂ | 1 | 2 | 3 |
| ਦਾਇਰਾ | ਇੱਕ ਸਕ੍ਰੀਨ | 5 ਸਕ੍ਰੀਨਾਂ ਤੱਕ | 12 ਸਕ੍ਰੀਨਾਂ ਤੱਕ, ਲੌਗਇਨ, ਟੈਸਟ |
| ਜਵਾਬਦੇਹ ਡਿਜ਼ਾਈਨ | ✓ | ✓ | ✓ |
| ਤੁਹਾਡੇ API ਨਾਲ ਕਨੈਕਟ ਕੀਤਾ ਗਿਆ | ✓ | ✓ | ✓ |
| ਸਰੋਤ ਕੋਡ | ✓ | ✓ | ✓ |
ਨਮੂਨੇ
ਇਸ Zinn ਨਾਲ ਸਬੰਧਤ ਵਿਕਰੇਤਾ ਦੇ ਕੰਮ ਦੀਆਂ ਉਦਾਹਰਨਾਂ ਦੇਖੋ।
ਪੋਰਟਫੋਲੀਓ
ਇਸ Zinn ਨਾਲ ਸਬੰਧਤ ਵਿਕਰੇਤਾ ਦੇ ਕੰਮ ਦੀਆਂ ਉਦਾਹਰਨਾਂ।
ਫਾਰਮਲਾਈਨ: ਸਟ੍ਰਾਈਪ ਦੇ ਨਾਲ Next.js ਸਟੋਰ
ਇੱਕ ਸਟੋਰਫਰੰਟ ਜਿਸਨੂੰ ਤੁਸੀਂ ਕਲਿੱਕ ਕਰ ਸਕਦੇ ਹੋ: 16 ਸੰਗ੍ਰਹਿ ਵਿੱਚ 4 ਪੋਸਟਰ, ਫਿਲਟਰ ਅਤੇ ਖੋਜ ਜੋ URL ਵਿੱਚ ਰਹਿੰਦੇ ਹਨ, ਇੱਕ ਕਾਰਟ, ਹਲਕੇ ਅਤੇ ਗੂੜ੍ਹੇ ਥੀਮ, ਅਤੇ ਇੱਕ ਚੈਕਆਉਟ ਜੋ ਇੱਕ ਡੈਮੋ ਆਰਡਰ ਜਾਂ ਟੈਸਟ ਮੋਡ ਵਿੱਚ ਇੱਕ ਅਸਲ ਸਟ੍ਰਾਈਪ ਚੈਕਆਉਟ ਸੈਸ਼ਨ ਵਿੱਚ ਖਤਮ ਹੁੰਦਾ ਹੈ। ਮੈਂ ਇਸਨੂੰ ਟਾਈਪਸਕ੍ਰਿਪਟ ਵਿੱਚ ਟੇਲਵਿੰਡ CSS ਦੇ ਨਾਲ ਇੱਕ Next.js ਸਟੈਟਿਕ ਐਕਸਪੋਰਟ ਵਜੋਂ ਬਣਾਇਆ ਹੈ। ਕਾਰਡ ਭੁਗਤਾਨ ਇੱਕ ਕਲਾਉਡਫਲੇਅਰ ਵਰਕਰ ਦੁਆਰਾ ਹੁੰਦੇ ਹਨ ਜੋ ਸਰਵਰ 'ਤੇ ਕਾਰਟ ਦੀ ਕੀਮਤ ਦੁਬਾਰਾ ਨਿਰਧਾਰਤ ਕਰਦਾ ਹੈ ਅਤੇ ਸਟ੍ਰਾਈਪ ਦੇ ਵੈਬਹੂਕ ਦਸਤਖਤ ਦੀ ਪੁਸ਼ਟੀ ਕਰਦਾ ਹੈ।
Next.js ਵਿੱਚ ਦੋਭਾਸ਼ੀ ਨਿੱਜੀ ਸਾਈਟ
ਅੰਗਰੇਜ਼ੀ ਅਤੇ ਰੂਸੀ ਵਿੱਚ ਇੱਕ ਇੱਕ-ਪੰਨੇ ਦੀ ਨਿੱਜੀ ਸਾਈਟ, ਸੇਵਾਵਾਂ ਭਾਗ ਅਤੇ ਮੇਰੇ ਡੈਮੋ ਪ੍ਰੋਜੈਕਟਾਂ ਦੇ ਲਿੰਕਾਂ ਦੇ ਨਾਲ। ਮੈਂ ਇਸਨੂੰ Next.js, React ਅਤੇ TypeScript ਨਾਲ ਇੱਕ ਸਟੈਟਿਕ ਐਕਸਪੋਰਟ ਵਜੋਂ ਡਿਜ਼ਾਈਨ ਅਤੇ ਬਣਾਇਆ ਹੈ, ਸਾਦੇ CSS ਮੋਡਿਊਲਾਂ ਅਤੇ ਬਿਨਾਂ UI ਫਰੇਮਵਰਕ ਦੇ ਸਟਾਈਲ ਕੀਤਾ ਗਿਆ ਹੈ। ਇਸ ਵਿੱਚ ਹਲਕੇ ਅਤੇ ਗੂੜ੍ਹੇ ਥੀਮ ਹਨ, ਅਤੇ ਹਰੇਕ ਭਾਸ਼ਾ ਲਈ ਇੱਕ ਸਮਾਜਿਕ ਪੂਰਵਦਰਸ਼ਨ ਚਿੱਤਰ ਬਿਲਡ ਸਮੇਂ ਤਿਆਰ ਕੀਤਾ ਜਾਂਦਾ ਹੈ। GitHub Actions ਇਸਨੂੰ ਬਣਾਉਂਦਾ ਹੈ ਅਤੇ Bunny CDN 'ਤੇ ਤੈਨਾਤ ਕਰਦਾ ਹੈ, ਜੋ ਸੁਰੱਖਿਆ ਹੈਡਰ ਜੋੜਦਾ ਹੈ ਅਤੇ www ਅਤੇ ਸਾਦੇ HTTP ਨੂੰ ਮੁੱਖ HTTPS ਪਤੇ 'ਤੇ ਰੀਡਾਇਰੈਕਟ ਕਰਦਾ ਹੈ।
ਸੇਵਾ ਵੇਰਵੇ
ਅਕਸਰ ਪੁੱਛੇ ਜਾਣ ਵਾਲੇ ਸਵਾਲ
ਹਾਂ। ਮੈਂ ਹਰੇਕ ਸਕ੍ਰੀਨ ਲਈ ਮੋਬਾਈਲ ਲੇਆਉਟ ਬਣਾਉਣ ਤੋਂ ਪਹਿਲਾਂ, ਲਿਖਤੀ ਰੂਪ ਵਿੱਚ ਜਾਂ ਇੱਕ ਤੇਜ਼ ਸਕੈਚ ਵਜੋਂ ਪ੍ਰਸਤਾਵਿਤ ਕਰਦਾ ਹਾਂ, ਤਾਂ ਜੋ ਤੁਸੀਂ ਇਸਨੂੰ ਅੰਤ ਵਿੱਚ ਖੋਜਣ ਦੀ ਬਜਾਏ ਪਹਿਲਾਂ ਹੀ ਮਨਜ਼ੂਰ ਕਰ ਸਕੋ।
ਹਾਂ। ਮੈਂ ਪਹਿਲਾਂ ਤੋਂ ਮੌਜੂਦ ਫੋਲਡਰ ਬਣਤਰ, ਨਾਮਕਰਨ ਅਤੇ ਸਟਾਈਲਿੰਗ ਦੀ ਪਾਲਣਾ ਕਰਦਾ ਹਾਂ, ਤਾਂ ਜੋ ਨਵਾਂ ਕੋਡ ਉਹੀ ਪੈਟਰਨ ਵਰਤੇ ਅਤੇ ਅਗਲੇ ਡਿਵੈਲਪਰ ਨੂੰ ਦੋ ਸਟਾਈਲ ਨਾ ਮਿਲਣ।
ਮੈਂ ਫਾਈਲ ਤੋਂ ਸਪੇਸਿੰਗ, ਆਕਾਰ ਅਤੇ ਰੰਗਾਂ ਦਾ ਮੇਲ ਕਰਦਾ ਹਾਂ। ਜਿੱਥੇ ਡਿਜ਼ਾਈਨ ਅਤੇ ਅਸਲ ਡੇਟਾ ਵਿੱਚ ਅਸਹਿਮਤੀ ਹੁੰਦੀ ਹੈ, ਜਿਵੇਂ ਕਿ ਮੌਕਅੱਪ ਨਾਲੋਂ ਲੰਬਾ ਨਾਮ, ਮੈਂ ਇਸਨੂੰ ਫਲੈਗ ਕਰਦਾ ਹਾਂ ਅਤੇ ਲੇਆਉਟ ਨੂੰ ਟੁੱਟਣ ਦੇਣ ਦੀ ਬਜਾਏ ਇੱਕ ਹੱਲ ਸੁਝਾਉਂਦਾ ਹਾਂ।
ਇਹ ਸੇਵਾ ਸਿਰਫ਼ ਫਰੰਟ ਐਂਡ ਹੈ। ਐਕਸਪ੍ਰੈਸ ਜਾਂ NestJS ਨਾਲ Node.js ਵਿੱਚ ਬੈਕਐਂਡ ਲਈ, ਮੇਰਾ ਬੈਕਐਂਡ Zinn ਦੇਖੋ, ਜਾਂ ਦੋਵੇਂ ਆਰਡਰ ਕਰੋ ਅਤੇ ਮੈਂ ਉਹਨਾਂ ਨੂੰ ਇਕੱਠੇ ਕੋਟ ਕਰਾਂਗਾ।
ਗਾਹਕ ਸਮੀਖਿਆਵਾਂ
ਦੇਖੋ ਸਾਡੇ ਗਾਹਕ ਇਸ Zinn ਬਾਰੇ ਕੀ ਕਹਿੰਦੇ ਹਨ
ਸ਼੍ਰੇਣੀਆਂ
Zinner ਨੀਤੀਆਂ
ਸਬੰਧਤ Zinns
