কন্টেন্ট
- 01. বাতিঘর
- 02. পলিমার
- 03. API গুলি এক্সপ্লোরার
- 04. তোলপাড়
- 05. গুগল গিটহাব
- 06. পুতুল
- 07. ওয়ার্কবক্স
- 08. কোডলাব
- 09. রঙ সরঞ্জাম
- 10. নকশা স্প্রিন্ট
- ১১. লোক + এআই গাইডবুক
- 12. গুগল সহকারী
- 13. পেজস্পিড অন্তর্দৃষ্টি
- 14. গুগলে এএমপি
- 15. গুগল ডেভটুলগুলি
- 16. উপাদান নকশা
ওয়েবে কাজ করার অর্থ সাধারণত আপনি কোনও আকার বা ফর্মের সাথে Google এর সাথে কাজ করবেন। এবং গুগল ক্রোম হিসাবে প্রতিযোগিতার আগে রাস্তা হিসাবে দেখা, ডিজাইনার এবং বিকাশকারীরা তাদের প্রকল্প ব্রাউজারের সাথে কীভাবে কাজ করবে সে সম্পর্কে চিন্তাভাবনা করা উচিত। কেমন লাগবে? এটি কোন প্রযুক্তি সমর্থন করে, এটি কতটা নিরাপদ এবং এটি কীভাবে সম্পাদন করবে?
ভাগ্যক্রমে, ক্রোম কোনও সাইট বা অ্যাপ্লিকেশন সর্বোত্তম হবে তা নিশ্চিত করার জন্য সরঞ্জাম সরবরাহ করে। ডেভটুলগুলি ডিজাইনার এবং বিকাশকারীদের একটি ওয়েব পৃষ্ঠায় অন্তর্দৃষ্টি অর্জন করতে সক্ষম করে: আপনি ডিওএম চালনা করতে পারবেন, সিএসএস পরীক্ষা করতে পারবেন, লাইভ এডিটিং সহ ডিজাইনে পরীক্ষা-নিরীক্ষা করতে পারেন, জাভাস্ক্রিপ্ট ডিবাগ করতে পারেন এবং কার্যকারিতা পরীক্ষা করতে পারেন। (এই গুগল ওয়েব সরঞ্জামগুলি কীভাবে ব্যবহার করতে হয় সে সম্পর্কে এখানে আরও দেখুন এবং আপনি যদি স্ক্র্যাচ থেকে শুরু করে থাকেন তবে আমাদের শীর্ষ ওয়েব নির্মাতাদের তালিকাও দেখুন)।
তবে গুগল কেবল ব্রাউজারের চেয়েও বেশি অফার করে। আপনার ডিজাইন এবং বিকাশ জীবনের প্রায় প্রতিটি ক্ষেত্রে সহায়তা করার জন্য এটিতে সরঞ্জাম এবং সংস্থান রয়েছে। পারফরম্যান্স কিভাবে উন্নত করতে হয় তা জানতে চান? বাতিঘর এখানে সাহায্যের জন্য। উন্নত পারফর্মিং মোবাইল সাইটগুলি তৈরি করতে চান? তারপরে এএমপিকে হ্যালো বলুন। আপনি কি সুন্দর পিডব্লিউএ তৈরির সন্ধান করছেন? তারপরে ফ্লটার, মেটেরিয়াল ডিজাইন এবং ওয়ার্কবক্স প্রবেশের জন্য প্রস্তুত।
গুগল সরঞ্জামগুলি, সংস্থানগুলি, গ্রন্থাগারগুলি এবং ফ্রেমওয়ার্কগুলি ব্যবহার করার সৌন্দর্য হ'ল আপনি জানেন যে তারা ক্রোম ব্রাউজার - গ্রহের সবচেয়ে জনপ্রিয় ব্রাউজারের সাথে ভালভাবে কাজ করবে। আরও সরঞ্জামের জন্য, আমাদের ওয়েব ডিজাইন সরঞ্জামগুলি রাউন্ডআপ দেখুন।
01. বাতিঘর
পারফরম্যান্স কোনও সাইটের সাফল্যের মূল কারণ এবং লাইটহাউস ওয়েব পৃষ্ঠাগুলির মান উন্নত করার জন্য গুগলের হাতিয়ার (সঠিক ওয়েব হোস্টিং পরিষেবাটিও সহায়তা করবে)। সুতরাং আপনি কীভাবে বাতিঘর ব্যবহার করবেন এবং এটি কী করতে পারে? এর সহজতম ফর্মটিতে, আপনি অডিটস ট্যাব থেকে লাইট হাউস চালাতে পারবেন এবং প্রস্তাবিত উন্নতিগুলি সহ একটি চূড়ান্ত প্রতিবেদন তৈরি করতে পারফরম্যান্স, অ্যাক্সেসিবিলিটি এবং এসইওর জন্য টিক বাক্সগুলি ছাড়াও ডেস্কটপ বা মোবাইল সহ অপশনগুলির একটি পছন্দ থেকে বেছে নিতে পারেন।
02. পলিমার
পলিমার ওয়েব উপাদানগুলির সাথে কাজ করার জন্য সুপরিচিত তবে প্রকল্পটি এখন লাইব্রেরি, সরঞ্জাম এবং স্ট্যান্ডার্ডগুলির সংগ্রহকে আলিঙ্গন করার জন্য এর পুস্তকটি প্রসারিত করেছে। কি অন্তর্ভুক্ত? লিটলেমেন্ট এমন একটি সম্পাদক যা ওয়েব উপাদানগুলি সংজ্ঞায়িত করা সহজ করে তোলে, যখন লিট-এইচটিএমএল এমন একটি এইচটিএমএল টেম্প্লেটিং লাইব্রেরি যা ব্যবহারকারীদের জেএসে পরবর্তী জেনের এইচটিএমএল টেমপ্লেট লিখতে সক্ষম করে। এছাড়াও, আপনি একটি পিডাব্লুএ স্টার্টার কিট, মূল পলিমার গ্রন্থাগার এবং ওয়েব উপাদানগুলির সেটও পাবেন।
03. API গুলি এক্সপ্লোরার
গুগল বিকাশকারীদের জন্য উপলব্ধ এপিআইয়ের একটি বিশাল গ্রন্থাগার রয়েছে তবে আপনার যা প্রয়োজন তা সন্ধান করা কোনও সহজ কাজ নয়। এটি হ'ল গুগলের এপিআইএস এক্সপ্লোরার একটি সাহায্যের হাতের প্রস্তাব দেয়। একটি দীর্ঘ তালিকা রয়েছে যার মাধ্যমে স্ক্রোল করা যায় তবে দ্রুত অ্যাক্সেসের জন্য, এপিআই তালিকা ফিল্টার করার জন্য একটি অনুসন্ধান বাক্স রয়েছে। প্রতিটি এন্ট্রি কোনও রেফারেন্স পৃষ্ঠায় লিঙ্ক করে কীভাবে এপিআই ব্যবহার করতে হবে তার আরও বিশদ।
04. তোলপাড়
আপনি যদি কোনও একক কোডবেস থেকে মোবাইল, ওয়েব এবং ডেস্কটপের জন্য সুদর্শন অ্যাপ্লিকেশন তৈরি করতে চাইছেন তবে আপনার পক্ষে বিড়বিড় হতে পারে। সাইটটি ফ্লটারের সাথে কাজ এবং বিল্ডিংয়ের একটি সম্পূর্ণ রেফারেন্স। কি করতে হবে তার কোনও ক্লু পাইনি? দস্তাবেজগুলি ব্যবহারকারীকে ইনস্টলেশন থেকে তৈরির দিকে নিয়ে যায়, প্রচুর নমুনা এবং টিউটোরিয়াল দ্বারা সহায়তা করে।
05. গুগল গিটহাব
যেমনটি বেশিরভাগই জানতে পারবেন, গিটহাব কোড এবং ফাইলগুলি সঞ্চয় এবং ভাগ করে নেওয়ার হোস্টিং প্ল্যাটফর্ম / সংগ্রহস্থল। এবং আনন্দের সাথে গুগলের প্ল্যাটফর্মে নিজস্ব দাগ রয়েছে যার মধ্যে 260 টিরও বেশি সংগ্রহস্থল রয়েছে। আপনার অনুসন্ধানের সময়টি কাটাতে ফিল্টারটি ব্যবহার করুন এবং আপনার যে খেলাগুলি বা অবদান রাখতে চান তার নিকটবর্তী হন।
06. পুতুল
নোডে অন্তর্নির্মিত, পপিটার একটি উচ্চ-স্তরের এপিআই সরবরাহ করে যা আপনাকে হেডলেস ক্রোম অ্যাক্সেস করতে সক্ষম করে - কার্যকরভাবে ইউআই ছাড়াই ক্রোম, যা বিকাশকারীরা কমান্ড লাইনের মাধ্যমে নিয়ন্ত্রণ করতে পারে। তাহলে আপনি পপিটারের সাথে কী করতে পারেন? পৃষ্ঠাগুলির স্ক্রিনশট এবং পিডিএফ উত্পন্ন করার জন্য, ফর্ম জমা দেওয়ার স্বয়ংক্রিয়তা এবং একটি স্বয়ংক্রিয় পরীক্ষার পরিবেশ তৈরির জন্য কয়েকটি বিকল্প উপলব্ধ।
07. ওয়ার্কবক্স
আপনি যদি পিডাব্লুএ তৈরির সন্ধান করছেন তবে এটি একটি দুর্দান্ত সূচনা পয়েন্ট। ওয়ার্কবক্স ওয়েব অ্যাপ্লিকেশনগুলিতে অফলাইন সমর্থন যুক্ত করার জন্য জাভাস্ক্রিপ্ট লাইব্রেরিগুলির একটি সংগ্রহ সরবরাহ করে। গভীরতার গাইডের একটি নির্বাচন দেখায় যে কীভাবে কোনও পরিষেবা কর্মী ফাইল তৈরি করতে এবং নিবন্ধিত করতে হবে, রুট অনুরোধগুলি, প্লাগইনগুলি ব্যবহার করতে হবে এবং ওয়ার্কবক্সের সাহায্যে বান্ডিলারগুলি ব্যবহার করতে হবে। এবং চেক আউট করার জন্য ক্যাশে কৌশলগুলির উদাহরণগুলির একটি সেটও রয়েছে।
08. কোডলাব
একটি গুগল পণ্য জন্য ব্যবহারিক গাইডেন্স প্রয়োজন? কোডল্যাবস "একটি গাইডড, টিউটোরিয়াল, হ্যান্ড-অন কোডিং অভিজ্ঞতা" সরবরাহ করে। সাইটটি বিভাগ এবং ইভেন্টগুলিতে ঝরঝরে হয়ে গেছে, যা আপনি চান তা দ্রুত এবং সহজ করে তোলে। এর মধ্যে রয়েছে অ্যানালিটিক্স, অ্যান্ড্রয়েড, সহকারী, সংযোজনিত বাস্তবতা, বিড়াল, জি স্যুট, অনুসন্ধান, টেনসরফ্লো এবং ভার্চুয়াল বাস্তবতা। একটি বিকল্প নির্বাচন করুন এবং আপনার ছোট অ্যাপ্লিকেশনগুলি তৈরি করতে আপনার প্রয়োজনীয় কোড এবং দিকনির্দেশগুলি পান।
09. রঙ সরঞ্জাম
রঙ সরঞ্জাম হ'ল একটি সরল সরঞ্জাম যা আপনাকে অ্যাক্সেসযোগ্যতা যাচাইয়ের পাশাপাশি একটি প্যালেট তৈরি করতে, ভাগ করতে এবং প্রয়োগ করতে সক্ষম করে। ব্যবহারকারীরা মেটেরিয়াল প্যালেট থেকে একটি পূর্বনির্ধারিত প্যালেট চয়ন করতে পারেন। কেবল একটি রঙ বেছে নিন এবং তারপরে এটি প্রাথমিক রঙের স্কিমে প্রয়োগ করুন, দ্বিতীয় বিকল্পটিতে স্যুইচ করুন এবং আবার বাছুন। শেষ পর্যন্ত, উভয় স্কিমের জন্য পাঠ্য রঙ চয়ন করুন। বিকল্পভাবে, আপনার রঙ চয়ন করতে কাস্টম এ স্যুইচ করুন। তারপরে প্যালেটটি রফতানি করার আগে অ্যাক্সেসিবিলিটিতে স্যুইচ করুন all
10. নকশা স্প্রিন্ট
ডিজাইন স্প্রিন্ট কিট তাদের জন্য যাঁরা কীভাবে ডিজাইন স্প্রিন্টে অংশ নিতে বা চালাবেন তা শিখছেন। এটি প্রথম-টাইমার থেকে শুরু করে অভিজ্ঞ স্প্রিন্ট ফ্যাসিলিটেটর পর্যন্ত সমস্ত জ্ঞানের ঘাঁটিগুলিকে কভার করে দেখায়। পদ্ধতি সম্পর্কে জানুন বা সংক্ষিপ্ত লেখার, ডেটা সংগ্রহ এবং গবেষণা, পাশাপাশি পোস্ট-স্প্রিন্ট কী করবেন সেগুলি সহ পরিকল্পনার পর্যায়ে সরাসরি চলে যান। এছাড়াও সরঞ্জাম, টেমপ্লেট, রেসিপি এবং আপনার নিজস্ব পদ্ধতি জমা দেওয়ার বিকল্পের মতো সংখ্যক সংস্থান রয়েছে। এছাড়াও, আপনার সম্ভবত সংস্থানগুলি সঞ্চয় এবং ভাগ করার জন্য অন্য কোথাও প্রয়োজন হবে যাতে আপনার মেঘ সংগ্রহের পছন্দটি পয়েন্টে রয়েছে তা নিশ্চিত করুন।
১১. লোক + এআই গাইডবুক
এই গাইডটি গুগলে পিপল + এআই গবেষণা উদ্যোগের কাজ এবং মানবিকেন্দ্রিক এআই পণ্যগুলি তৈরি করতে চাইলে তাদের সহায়তা দেওয়ার জন্য দেখায়। ব্যবহারকারীদের প্রয়োজনীয়তা, ডেটা সংগ্রহ এবং মূল্যায়ন, মানসিক মডেল, বিশ্বাস, প্রতিক্রিয়া এবং সুদৃ failure় ব্যর্থতা সম্পর্কিত বিস্তৃত গাইড বইটি ছয়টি অধ্যায়গুলিতে বিভক্ত। প্রতিটি অধ্যায়ের সাথে অনুশীলন, কার্যপত্রক এবং এটি ঘটানোর জন্য প্রয়োজনীয় সরঞ্জাম ও সংস্থান রয়েছে।
12. গুগল সহকারী
এটি গুগল অ্যাসিস্ট্যান্টের বিকাশকারী প্ল্যাটফর্ম, কীভাবে গুগল সহায়ক সহ আপনার সামগ্রী এবং পরিষেবাদি একীভূত করতে পারে তার জন্য একটি গাইড অফার করে। এটি আপনাকে দেখায় যে কীভাবে আপনার মোবাইল অ্যাপ্লিকেশনটি প্রসারিত করা যায়, অনুসন্ধান এবং সহকারীগুলির জন্য সমৃদ্ধ উপায়ে সামগ্রী সরবরাহ করতে হবে, বাড়ির চারপাশে নিয়ন্ত্রণের আলো, কফি মেশিন এবং অন্যান্য ডিভাইস এবং স্মার্ট স্পিকার, ডিসপ্লে এবং ফোনের জন্য ভয়েস এবং ভিজ্যুয়াল অভিজ্ঞতা তৈরি করা যায়।
13. পেজস্পিড অন্তর্দৃষ্টি
পেজস্পিড অন্তর্দৃষ্টিগুলি ওয়েব সামগ্রীর বিশ্লেষণ করে এবং তারপরে কীভাবে এটি দ্রুত লোড করা যায় সে সম্পর্কে পরামর্শ দেয়। কেবল একটি URL যুক্ত করুন, বিশ্লেষণ বোতামটি চাপুন এবং যাদুটি হওয়ার জন্য অপেক্ষা করুন। পেজস্পিড এপিআই কীভাবে কাজ করে এবং কীভাবে এটি ব্যবহার শুরু করবেন সে সম্পর্কে আরও ভাল অন্তর্দৃষ্টি পেতে ডক্সটি পরীক্ষা করুন।
14. গুগলে এএমপি
এএমপি হ'ল দ্রুত পৃষ্ঠা লোড করা মোবাইল পৃষ্ঠাগুলি তৈরির জন্য গুগলের একটি সরঞ্জাম যা (আশা করি) অনুসন্ধানের র্যাঙ্কিংয়ের শীর্ষে উঠবে। কীভাবে দ্রুত, ব্যবহারকারী-প্রথম সাইটগুলি তৈরি করবেন, গুগল পণ্য জুড়ে এএমপি সংহত করতে হবে, এএমপি পৃষ্ঠাগুলি আরও দ্রুত করতে গুগল এএমপি ক্যাচ ব্যবহার করুন এবং অন্যান্য গুগল পণ্যগুলির সাথে এএমপি পৃষ্ঠাগুলি পর্যবেক্ষণ করুন।
15. গুগল ডেভটুলগুলি
প্রতিটি ডিজাইনার এবং বিকাশকারী জানেন (বা কমপক্ষে জানা উচিত) যে ক্রোম সরাসরি ব্রাউজারে তৈরি সরঞ্জামগুলির একটি সেট নিয়ে আসে। ক্রোমের ডিভটুলগুলি এমন কোনও উপাদান তৈরি করে যা কোনও পৃষ্ঠা তৈরি করে, সিএসএস পরীক্ষা করে, ফ্লাইতে পৃষ্ঠাগুলি সম্পাদনা করে এবং আরও অনেক কিছুর জন্য নিখুঁত।
এলিমেটস ট্যাবটি হল ডিভুলসগুলির পরিচিতি। এটি এইচটিএমএল কোডটি প্রদর্শন করে যা নির্বাচিত পৃষ্ঠাটি তৈরি করে। নির্বাচিত পৃষ্ঠা থেকে প্রতিটি ডিভ বা ট্যাগের বৈশিষ্ট্যগুলির অন্তর্দৃষ্টি পান এবং সরাসরি সম্পাদনা শুরু করুন। এটি ডিজাইনের সাথে পরীক্ষার জন্য উপযুক্ত। লেআউটটি পরীক্ষা করুন - আপনি ফ্লেক্সবক্স বা গ্রিড ব্যবহার করছেন কিনা - এবং উদাহরণগুলির সাথে সম্পর্কিত ফন্টগুলি একবার দেখুন এবং অ্যানিমেশনগুলি পরীক্ষা করুন।
অন্য কোথাও, আপনি সিএসএস দেখতে এবং পরিবর্তন করতে পারেন। এলিমেন্টস প্যানেলে স্টাইলস ট্যাবটি ডিওএম ট্রিতে বর্তমানে নির্বাচিত উপাদানগুলিতে সিএসএস বিধি প্রয়োগ করা হচ্ছে তা তালিকাভুক্ত করে। ডিজাইনগুলির সাথে পরীক্ষার জন্য বৈশিষ্ট্যগুলি চালু এবং বন্ধ (বা নতুন মান যুক্ত করুন) স্যুইচ করুন। এটি লাইভ ডিজাইনে কোনও পরিবর্তন প্রয়োগ করার আগে প্রত্যাশা অনুযায়ী সবকিছু কাজ করে তা নিশ্চিত করার জন্য এটি সঠিক সরঞ্জাম।
আপনি জাভাস্ক্রিপ্ট ডিবাগ করতে পারেন, ওয়েবসাইটের গতি অনুকূল করতে এবং নেটওয়ার্কের গতি পরিদর্শন করতে পারেন। আপনার কর্মপ্রবাহ তাত্ক্ষণিক গতি বাড়ানোর জন্য আপনি এখানে একটি দ্রুত টিপ ব্যবহার করতে পারেন। উত্স ট্যাবে চলে যান, নতুন স্নিপেটে ক্লিক করুন এবং প্রায়শই ব্যবহৃত কোড যুক্ত করুন। কোড স্নিপেটের নাম দিন এবং সংরক্ষণ করুন। প্রয়োজন অনুসারে পুনরাবৃত্তি করুন। এখন আপনি এই কোডটি আবার লেখার পরিবর্তে স্নিপেট ধরে নিতে পারেন।
প্রতিটি ভাল ব্রাউজারের মতো, ক্রোম ক্রমাগত বিকশিত হয় এবং প্রতিটি নতুন প্রকাশ নতুন বৈশিষ্ট্য নিয়ে আসে। Chrome স্ট্যাটাস প্ল্যাটফর্মে কী হচ্ছে তা সন্ধান করুন
16. উপাদান নকশা
বিকাশকে গুগলের পছন্দের শিশু হিসাবে দেখা যেতে পারে তবে আপনি যা কিছু তৈরি করছেন, তৈরি করছেন বা বিল্ডিং করছেন তা দেখতে সুন্দর লাগবে এবং ব্যবহারকারীকে এমন অভিজ্ঞতা দেওয়া দরকার যা তাদের এটি ব্যবহার করতে চায় want গুগল স্থিতাবস্থায় উপাদান হ'ল সাম্প্রতিক সংযোজন তবে এটি একটি ডিজাইন সিস্টেম যা ডিজাইনের কিটের একটি গুরুত্বপূর্ণ অংশে পরিপক্ক।
যে কোনও ভাল ডিজাইনের সিস্টেমের মতো, এর নিজস্ব নির্দেশিকাগুলির সেট রয়েছে, যা আপনাকে আরও উত্তেজনাপূর্ণ স্টাফে পদক্ষেপ নেওয়ার আগে দেখতে হবে। কীভাবে বিভিন্ন উপাদান ব্যবহার করা যায়, কী কী উপাদান ব্যবহার করা যায়, কীভাবে কোনও থিম বাস্তবায়িত করা যায় এবং অ্যাক্সেসযোগ্যতার সহ ব্যবহারযোগ্যতা গাইডগুলি কীভাবে তার ওভারভিউ পান। অন্য কোথাও মেটেরিয়াল ফাউন্ডেশনের অন্তর্দৃষ্টি রয়েছে, এতে নকশার মূল ক্ষেত্রগুলি যেমন লেআউট, নেভিগেশন, রঙ, টাইপোগ্রাফি, শব্দ, আইকনোগ্রাফি, গতি এবং মিথস্ক্রিয়া অন্তর্ভুক্ত রয়েছে। প্রতিটি বিভাগ তার করণীয় এবং না করা প্রকাশ করে এবং যেখানে আপনাকে সাবধানতা অবলম্বন করা উচিত। কী প্রত্যাশা করবেন সে সম্পর্কে একটি ধারণা দেওয়ার জন্য, লেআউট বিভাগটি কলাম, গটার এবং মার্জিন, ব্রেকপয়েন্টস, ইউআই অঞ্চল এবং নাম ব্যবধান ব্যবস্থাসহ একটি প্রতিক্রিয়াশীল বিন্যাস সহ কীভাবে কাজ করবেন তা বোঝার জন্য লেআউট, পিক্সেল ঘনত্ব, বিভাগগুলি সরবরাহ করে।
ডিজাইন বিভাগের বাইরে উপাদানগুলি রয়েছে, যা একটি নকশা তৈরি করতে প্রয়োজনীয় শারীরিক বিল্ডিং ব্লক সরবরাহ করে। এখানে কি অন্তর্ভুক্ত? বোতাম, ব্যানার, কার্ড, ডায়লগ, ডিভাইডার, তালিকা, মেনু, অগ্রগতি সূচক, স্লাইডার, স্নাকবার (এগুলি পর্দার নীচে অ্যাপ প্রক্রিয়া সম্পর্কে সংক্ষিপ্ত বার্তা), ট্যাবগুলি, পাঠ্য ক্ষেত্রগুলি এবং সরঞ্জামদণ্ডগুলি ps নিঃসন্দেহে উপাদানগুলির একটি বৃহত সংগ্রহ।
এবং বিভিন্ন প্ল্যাটফর্ম - অ্যান্ড্রয়েড, আইওএস, ওয়েব এবং ঝাঁকুনির জন্য কীভাবে তৈরি করবেন তার বিশদ এবং টিউটোরিয়াল সহ ডেভেলপারদের ভুলে যাওয়া হয়নি। এবং, অবশেষে, আপনার নির্বাচিত নকশাটি ঘটতে সহায়তা করার জন্য একটি সংস্থান সংস্থানকে উত্সর্গীকৃত একটি পৃষ্ঠা রয়েছে।
এই নিবন্ধটি মূলত নেট ম্যাগাজিনে প্রকাশিত হয়েছিল। ইস্যু 326 কিনুন.
