आम्ही वेब डेव्हलपर्ससाठी एक प्रभावी कार्यप्रवाह आयोजित करतो: संगम, एअरटेबल आणि इतर साधने

मी सुमारे दोन वर्षांपासून फ्रंट-एंड डेव्हलपर म्हणून काम करत आहे आणि विविध प्रकारच्या प्रकल्पांच्या निर्मितीमध्ये भाग घेतला आहे. मी शिकलेल्या धड्यांपैकी एक म्हणजे समान ध्येय सामायिक करणार्‍या परंतु भिन्न कार्ये आणि जबाबदाऱ्या असणार्‍या विकासकांच्या विविध संघांमधील सहयोग सोपे नाही.

इतर कार्यसंघ सदस्य, डिझाइनर आणि विकासक यांच्याशी सल्लामसलत करून, मी लहान संघांसाठी (5-15 लोकांसाठी) डिझाइन केलेले वेबसाइट निर्मिती चक्र तयार केले. यात कॉन्फ्ल्युअन्स, जिरा, एअरटेबल आणि अॅबस्ट्रॅक्ट सारख्या साधनांचा समावेश आहे. या लेखात मी कार्यप्रवाह आयोजित करण्याची वैशिष्ट्ये सामायिक करेन.

स्किलबॉक्स शिफारस करतो: दोन वर्षांचा प्रॅक्टिकल कोर्स "मी वेब डेव्हलपर प्रो आहे".

आम्ही आठवण करून देतो: सर्व Habr वाचकांसाठी - Habr प्रोमो कोड वापरून कोणत्याही स्किलबॉक्स कोर्समध्ये नावनोंदणी करताना 10 रूबल सवलत.

या सगळ्याची गरज का आहे?

सुरवातीपासून वेबसाइट तयार करण्यासाठी आवश्यक असलेली किमान टीम डिझायनर, प्रोग्रामर आणि प्रोजेक्ट मॅनेजर आहे. माझ्या बाबतीत संघ तयार झाला. पण काही साईट्स रिलीझ केल्यावर मला जाणवलं की त्यात काहीतरी गडबड आहे. काहीवेळा आम्हाला आमच्या जबाबदाऱ्या पूर्णपणे समजल्या नाहीत आणि क्लायंटशी संप्रेषण खूप हवे होते. या सगळ्यामुळे प्रक्रिया मंदावली आणि सर्वांनाच त्रास झाला.

मी समस्या सोडवण्याचे काम करू लागलो.

Google शोध आमच्या समस्येवर चांगले परिणाम देते.

केलेले काम अधिक दृश्यमान करण्यासाठी, मी एक वर्कफ्लो डायग्राम तयार केला आहे जो येथे काम कसे केले जाते याची समज देतो.

पूर्ण रिझोल्यूशनमध्ये उघडण्यासाठी प्रतिमेवर क्लिक करा.

ध्येय आणि उद्दिष्टे

मी चाचणी करण्याचा निर्णय घेतलेल्या पहिल्या तंत्रांपैकी एक म्हणजे “कॅस्केड मॉडेल” (वॉटरफॉल). मी समस्या हायलाइट करण्यासाठी आणि त्यांचे निराकरण कसे करावे हे समजून घेण्यासाठी वापरले.

समस्या: बर्‍याचदा, क्लायंट वेबसाइट निर्मिती प्रक्रियेचे मॉड्यूलरपणे मूल्यांकन करत नाही, जसे विकासक करतात. तो एक नियमित साइट म्हणून समजतो, म्हणजेच तो वैयक्तिक पृष्ठांच्या संदर्भात विचार करतो. त्याच्या मते, डिझाइनर आणि प्रोग्रामर एकामागून एक स्वतंत्र पृष्ठे तयार करतात. परिणामी, प्रत्यक्ष प्रक्रियेदरम्यान काय होते ते ग्राहकाला समजत नाही.

कार्य: अन्यथा क्लायंटला पटवून देण्यात काही अर्थ नाही; सर्वोत्तम पर्याय म्हणजे पृष्ठ-दर-पृष्ठ मॉडेलवर आधारित कंपनीमध्ये वेबसाइट तयार करण्यासाठी मॉड्यूलर प्रक्रिया विकसित करणे.

युनिव्हर्सल डिझाइन टोकन आणि घटक दोन्ही विकासक आणि डिझाइनरद्वारे व्यवस्थापित केले जातात.

समस्या: ही एक सामान्य परिस्थिती आहे ज्याला अनेक धोरणे संबोधित करतात. बरेच मनोरंजक उपाय आहेत, बहुतेक प्रकरणांमध्ये एक डिझाइन सिस्टम तयार करण्याचा प्रस्ताव आहे जो शैली मार्गदर्शक / लायब्ररी जनरेटरद्वारे नियंत्रित केला जातो. परंतु आमच्या परिस्थितीत, विकास प्रक्रियेत आणखी एक घटक जोडणे जे आम्हाला डिझाइनरसाठी प्रवेश पातळी व्यवस्थापित करण्यास अनुमती देईल.

कार्य: एक सार्वत्रिक प्रणाली तयार करणे ज्यामध्ये डिझाइनर, विकासक आणि व्यवस्थापक एकमेकांमध्ये हस्तक्षेप न करता समकालिकपणे कार्य करू शकतात.

अचूक विकास ट्रॅकिंग

समस्या: समस्यांचा मागोवा घेण्यासाठी आणि एकूण प्रगती मोजण्यासाठी अनेक उपयुक्त साधने उपलब्ध असताना, बहुतेक लवचिक किंवा इष्टतम नाहीत. हे साधन संघाचा वेळ वाचवून उपयुक्त ठरू शकते जो सामान्यत: विशिष्ट कार्यांवरील प्रश्न आणि स्पष्टीकरणांवर खर्च केला जाईल. हे व्यवस्थापकांना संपूर्ण प्रकल्पाची अधिक अचूक समज देऊन त्यांचे जीवन सोपे करते.

कार्य: विविध कार्यसंघ सदस्यांनी केलेल्या कार्यांच्या प्रगतीचा मागोवा घेण्यासाठी डॅशबोर्ड तयार करा.

साधनांचा संच

वेगवेगळ्या साधनांवर प्रयोग केल्यानंतर, मी खालील संचावर स्थिरावलो: संगम, जिरा, एअरटेबल आणि अ‍ॅबस्ट्रॅक्ट. खाली मी प्रत्येकाचे फायदे सांगेन.

संगम

साधनाची भूमिका: माहिती आणि संसाधन केंद्र.

कॉन्फ्लुएंसचे कार्यक्षेत्र सेट करणे तुलनेने सोपे आहे, त्यात बरीच वैशिष्ट्ये आहेत, विविध अॅप्ससह एकत्रीकरण आहेत आणि वैयक्तिक, सानुकूल करण्यायोग्य टेम्पलेट आहेत. हे एक-आकार-फिट-सर्व समाधान नाही, परंतु माहिती आणि संसाधन केंद्र म्हणून ते आदर्श आहे. याचा अर्थ प्रकल्पाशी संबंधित कोणताही संदर्भ किंवा तांत्रिक तपशील डेटाबेसमध्ये प्रविष्ट करणे आवश्यक आहे.

हे टूल तुम्हाला प्रत्येक घटकाचे आणि प्रकल्पाविषयीचे इतर तपशील योग्यरित्या दस्तऐवजीकरण करण्याची परवानगी देते.

कॉन्फ्लुएंसचा मुख्य फायदा म्हणजे दस्तऐवज टेम्पलेट्सचे सानुकूलन. याव्यतिरिक्त, याचा वापर स्पेसिफिकेशन्सचा एकल रेपॉजिटरी आणि विविध प्रकल्प दस्तऐवजीकरण, सहभागींच्या प्रवेश पातळी विभक्त करण्यासाठी केला जाऊ शकतो. आता तुम्हाला काळजी करण्याची गरज नाही की तुमच्याकडे स्पेसिफिकेशनची जुनी आवृत्ती आहे, जसे तुम्ही ईमेलद्वारे कागदपत्रे पाठवता तेव्हा होते.

साधनाबद्दल अधिक माहिती अधिकृत उत्पादन वेबसाइटवर उपलब्ध.

Jira

साधनाची भूमिका: समस्या निरीक्षण आणि कार्य व्यवस्थापन.

जिरा हे एक अतिशय शक्तिशाली प्रकल्प नियोजन आणि व्यवस्थापन साधन आहे. कार्यक्षमतेचा मुख्य भाग म्हणजे सानुकूल करण्यायोग्य वर्कफ्लोची निर्मिती. समस्यांचे प्रभावीपणे व्यवस्थापन करण्यासाठी (जे आम्हाला आवश्यक आहे), विनंती प्रकार आणि समस्या प्रकार (समस्या प्रकार) च्या योग्य वापरावर विशेष लक्ष देणे योग्य आहे.

त्यामुळे, विकासक योग्य डिझाईनवर आधारित घटक तयार करत आहेत याची खात्री करण्यासाठी, प्रत्येक वेळी डिझाइनमध्ये काहीतरी बदल झाल्यावर त्यांना सूचित करणे आवश्यक आहे. घटक अद्ययावत होताच, डिझायनरला समस्या उघडणे आवश्यक आहे, एक जबाबदार विकसक नियुक्त करणे, त्याला योग्य समस्या प्रकार नियुक्त करणे आवश्यक आहे.

जिरा सह, आपण खात्री बाळगू शकता की प्रक्रियेतील पूर्णपणे सर्व सहभागी (मी तुम्हाला आठवण करून देतो, आमच्या बाबतीत त्यापैकी 5-15 आहेत) योग्य कार्ये प्राप्त करतात जी गमावली जात नाहीत आणि त्यांचा एक्झिक्युटर शोधतात.

जिरा बद्दल अधिक जाणून घ्या अधिकृत उत्पादन वेबसाइटवर उपलब्ध.

एअरटेबल

साधनाची भूमिका: घटक व्यवस्थापन आणि प्रगती मंडळ.

एअरटेबल हे स्प्रेडशीट आणि डेटाबेस यांचे मिश्रण आहे. हे सर्व वर चर्चा केलेल्या सर्व साधनांचे ऑपरेशन सानुकूलित करणे शक्य करते.

उदाहरण 1: घटक व्यवस्थापन

शैली मार्गदर्शक जनरेटरसाठी, ते वापरणे नेहमीच सोयीचे नसते - समस्या अशी आहे की डिझाइनर ते संपादित करू शकत नाहीत. शिवाय, स्केच घटक लायब्ररी वापरणे हा चांगला निर्णय होणार नाही, कारण त्यात अनेक मर्यादा आहेत. बहुधा, तुम्ही ही लायब्ररी प्रोग्रामच्या बाहेर वापरण्यास सक्षम असणार नाही.

एअरटेबल एकतर परिपूर्ण नाही, परंतु इतर अनेक समान समाधानांपेक्षा ते चांगले आहे. येथे घटक व्यवस्थापन सारणी टेम्पलेटचा डेमो आहे:

जेव्हा विकासक डिझाइन घटक स्वीकारतो, तेव्हा तो घटक टेबलमध्ये रेकॉर्ड करून परिणामी ABEM चे मूल्यमापन करतो. एकूण 9 स्तंभ आहेत:

• नाव - ABEM तत्त्वानुसार घटकाचे नाव.
• पूर्वावलोकन - येथे एकतर स्क्रीनशॉट किंवा दुसर्‍या स्त्रोतावरून डाउनलोड केलेल्या घटकाची प्रतिमा ठेवली जाते.
• दुवा जोडलेले पृष्ठ हे घटकाच्या पृष्ठाची लिंक असते.
• बाल घटक - बाल घटकांचा दुवा.
• सुधारक - शैली पर्यायांची उपस्थिती तपासते आणि त्यांना परिभाषित करते (उदाहरणार्थ, सक्रिय, लाल, इ.).
• घटक श्रेणी ही एक सामान्य श्रेणी आहे (मजकूर, प्रचारात्मक प्रतिमा, साइडबार).
• विकास स्थिती - वास्तविक विकास प्रगती आणि त्याची व्याख्या (पूर्ण, प्रगतीपथावर इ.).
• जबाबदार - विकासक जो या घटकासाठी जबाबदार आहे.
• अणु पातळी ही या घटकाची अणु श्रेणी आहे (अणु रचनेच्या संकल्पनेनुसार).
• डेटा समान किंवा भिन्न सारण्यांमध्ये संदर्भित केला जाऊ शकतो. ठिपके जोडल्याने स्केलिंग करताना गोंधळ टाळता येईल. याव्यतिरिक्त, डेटा फिल्टर, क्रमवारी आणि कोणत्याही समस्यांशिवाय बदलला जाऊ शकतो.

उदाहरण 2: पृष्ठ विकास प्रगती

पेज डेव्हलपमेंटच्या प्रगतीचे मूल्यमापन करण्यासाठी, तुम्हाला या उद्देशासाठी खास तयार केलेल्या टेम्पलेटची आवश्यकता आहे. टेबल स्वतः संघाच्या आणि क्लायंटच्या दोन्ही गरजा पूर्ण करू शकते.

पृष्ठाबद्दल कोणतीही माहिती येथे नोंदविली जाऊ शकते. ही एक अंतिम मुदत आहे, इनव्हिजन प्रोटोटाइपची लिंक, गंतव्यस्थान, मूल घटक. हे ताबडतोब लक्षात येते की ऑपरेशन्स करणे अतिशय सोयीचे आहे, दोन्ही डिझाइनचे दस्तऐवजीकरण आणि अद्यतनित करणे, तसेच फ्रंट-एंड आणि बॅक-एंड विकासाची स्थिती. शिवाय, या ऑपरेशन्स एकाच वेळी केल्या जातात.

सार

साधनाची भूमिका: डिझाइन मालमत्तेसाठी आवृत्ती नियंत्रणाचा एकल स्रोत.

स्केचमधील मालमत्तेसाठी अ‍ॅबस्ट्रॅक्टला गिटहब म्हटले जाऊ शकते आणि ते डिझायनर्सना फायली कॉपी आणि पेस्ट करण्यापासून वाचवते. साधनाचा मुख्य फायदा असा आहे की ते "सत्याचा एकल स्रोत" म्हणून कार्य करणारे डिझाइन भांडार प्रदान करते. डिझायनर्सनी मास्टर ब्रँचला मान्यताप्राप्त लेआउटच्या नवीनतम आवृत्तीवर अपडेट करणे आवश्यक आहे. त्यानंतर, त्यांना विकासकांना सूचित करावे लागेल. त्या बदल्यात, मुख्य शाखेतील डिझायनर मालमत्तेसहच कार्य करावे.

एक निष्कर्ष म्हणून

आम्ही नवीन विकास प्रक्रिया आणि वर नमूद केलेली सर्व साधने लागू केल्यानंतर आमच्या कामाचा वेग किमान दुप्पट वाढला. हा एक परिपूर्ण उपाय नाही, परंतु तो खूप चांगला आहे. खरे आहे, ते कार्य करण्यासाठी, आपल्याला खूप प्रयत्न करावे लागतील - हे सर्व कार्यरत स्थितीत अद्यतनित करण्यासाठी आणि राखण्यासाठी "मॅन्युअल वर्क" आवश्यक आहे.

स्किलबॉक्स शिफारस करतो:

• प्रॅक्टिकल कोर्स "मोबाइल डेव्हलपर प्रो".
• ऑनलाईन कोर्स "C# विकसक".
• एक वर्षाचा प्रॅक्टिकल कोर्स "PHP विकसक 0 ते PRO".

स्त्रोत: www.habr.com