ফ্রন্ট-এন্ড ডোজো: ডেভেলপার দক্ষতা প্রশিক্ষণের জন্য প্রকল্প (5 নতুন + 43 পুরানো)

1. ধারণা ক্লোন

ধারণা অ্যাপ্লিকেশনটি অনেকের কাছে প্রিয়; এটি আপনাকে আপনার ওয়ার্কফ্লো অপ্টিমাইজ করতে, নথিগুলির সাথে কাজ করতে, কাজের সময়সূচী করতে এবং ডিভাইসগুলির মধ্যে ডেটা সিঙ্ক্রোনাইজ করতে দেয়৷

www.notion.so

একটি ধারণা ক্লোন তৈরি করে আপনি যা শিখবেন:

• এইচটিএমএল ড্র্যাগ অ্যান্ড ড্রপ এপিআই. ব্যবহারকারী "মাউস দিয়ে ধরতে পারে" টেনে আনা যায় উপাদান এবং এটি স্থাপন করুন ড্রপযোগ্য মণ্ডল.
• আপনার কম্পিউটার এবং স্মার্টফোনের মধ্যে রিয়েল টাইমে ডেটা কীভাবে সিঙ্ক্রোনাইজ করবেন।
• আমরা ব্যবহারকারীদের রেকর্ড তৈরি, পড়তে, আপডেট এবং মুছে ফেলার অনুমতি দিই, যার ফলে CRUD দক্ষতা প্রশিক্ষণ দেওয়া হয়।

নিবন্ধটি EDISON সফ্টওয়্যারের সহায়তায় অনুবাদ করা হয়েছিল, যা অ্যাপ্লিকেশন এবং ওয়েবসাইট বিকাশ করেএবং স্টার্টআপে বিনিয়োগ করে.

2. Repl.it ক্লোন

Repl.it রিয়েল-টাইম সহযোগী কোড সম্পাদনার একটি টুল। আপনি বেশ কয়েকটি ভাষা বেছে নিতে পারেন: JavaScript, Python, Go এবং কোডটি সরাসরি ব্রাউজারে চালান। দ্রুত ডেমো এবং কোড সাক্ষাত্কারের জন্য খুব দরকারী।

repl.it

Repl.it ক্লোন তৈরি করে আপনি যা শিখবেন:

• ব্রাউজারে (ক্লায়েন্ট-সাইড) কোড (সার্ভার-সাইড) কীভাবে চালাবেন এবং কার্যকর করবেন।
• ইনপুট ডেটা (সোর্স কোড) পড়ুন এবং এক্সিকিউশন ফলাফল প্রদর্শন করুন।
• কীভাবে ওয়েবে ফাইল এবং ফোল্ডার তৈরি করবেন এবং ফলাফলগুলি সংরক্ষণ করবেন।
• কীভাবে কোড সিনট্যাক্স হাইলাইট করবেন।

3. গুগল ফটো ক্লোন

Google Photos হল ফটো সংরক্ষণ এবং শেয়ার করার জন্য একটি পরিষেবা।
যেকোনো আধুনিক ফটো অ্যাপ্লিকেশন মৌলিক ফাংশন সম্পাদন করতে পারে: আপলোড, ক্রপ, ইত্যাদি। লোকেরা তাদের নিজস্ব অবতার তৈরি করতে এবং বিড়ালের ছবি শেয়ার করতে চায়, তাই আপনাকে চিত্রগুলির সাথে কাজ করতে সক্ষম হতে হবে।

www.google.com/photos/about

একটি Google ফটো ক্লোন তৈরি করে আপনি যা শিখবেন:

• ফোন, ট্যাবলেট, ল্যাপটপ এবং এমনকি দৈত্যাকার টিভি স্ক্রিনে কীভাবে প্রতিক্রিয়াশীল ছবি তৈরি করবেন।
• ছবি আপলোডগুলি, বিশেষ করে বড় ছবি (>1MB) এবং বাল্ক আপলোডগুলি কীভাবে পরিচালনা করবেন৷
• থাম্বনেইলের জন্য বা গ্যালারি খোলার সময় চিত্র ফাইলগুলি প্রসেস করুন, ক্রপ করুন এবং ফটো রিসাইজ করুন।
• বোনাস: কিভাবে ক্লাউড বা স্থানীয় ডাটাবেসে ছবি সংরক্ষণ করতে হয়।

4. Gifsky ক্লোন

জিফস্কি ফাংশন ব্যবহার করে ভিডিওকে GIF তে রূপান্তর করেpngquant দক্ষ ক্রস-ফ্রেম প্যালেট এবং টেম্পোরাল অ্যান্টি-আলিয়াসিং এর জন্য। ফলাফল প্রতি ফ্রেমে হাজার হাজার ফুল সহ একটি GIF।

gif.ski

একটি Gifski ক্লোন তৈরি করে আপনি যা শিখবেন:

• কিভাবে ভিডিও ফাইল (.mp4 থেকে .gif) কনভার্ট করবেন।
• এইচটিএমএল এপিআই কিভাবে টেনে আনবেন এবং ড্রপ করবেন।
• কিভাবে ইমেজ অপ্টিমাইজেশান এবং প্রসেসিং কাজ করে।

দ্রষ্টব্য: Gifsky একটি ওপেন সোর্স প্রকল্প এবং GitHub এ আছে!

5. ক্রিপ্টোকারেন্সি রেট পর্যবেক্ষণ করা

নেটিভ ক্রিপ্টোকারেন্সি ট্র্যাকার প্রতিক্রিয়া করুন

একটি মুদ্রা হার ট্র্যাকার তৈরি করে আপনি যা শিখবেন:

• কিভাবে API এর সাথে কাজ করবেন এবং API থেকে দূরবর্তীভাবে ডেটা গ্রহণ করবেন।
• একটি তালিকা হিসাবে তথ্য প্রদর্শন কিভাবে.
• বোনাস: আপনি আগ্রহী হলে, আমি সম্প্রতি লিখেছেন একটি মূল্য ট্র্যাকার তৈরির টিউটোরিয়াল রিঅ্যাক্ট নেটিভ সহ ক্রিপ্টোকারেন্সির জন্য।

দ্রষ্টব্য: এখানে GitHub উদাহরণ সংগ্রহস্থল.

পূর্ববর্তী প্রকাশনা থেকে প্রকল্পের একটি নির্বাচন.

স্তর

www.reddit.com/r/layer

স্তর হল একটি সম্প্রদায় যেখানে প্রত্যেকে একটি ভাগ করা "বোর্ডে" একটি পিক্সেল আঁকতে পারে৷ মূল ধারণার জন্ম হয়েছিল Reddit-এ। আর/লেয়ার সম্প্রদায় হল ভাগ করা সৃজনশীলতার একটি রূপক, যে প্রত্যেকে একজন সৃষ্টিকর্তা হতে পারে এবং একটি সাধারণ কারণের জন্য অবদান রাখতে পারে।

আপনার নিজের লেয়ার প্রকল্প তৈরি করার সময় আপনি যা শিখবেন:

• জাভাস্ক্রিপ্ট ক্যানভাস কিভাবে কাজ করে একটি ক্যানভাস কিভাবে পরিচালনা করতে হয় তা জানা অনেক অ্যাপ্লিকেশনের জন্য একটি গুরুত্বপূর্ণ দক্ষতা।
• কিভাবে ব্যবহারকারীর অনুমতি সমন্বয়. প্রতিটি ব্যবহারকারী লগ ইন না করেই প্রতি 15 মিনিটে একটি পিক্সেল আঁকতে পারে।
• কুকি সেশন তৈরি করুন।

Squoosh

squoosh.app

Squoosh অনেক উন্নত বিকল্প সহ একটি ইমেজ কম্প্রেশন অ্যাপ্লিকেশন.

GIF 20 MB

স্কুশের আপনার নিজস্ব সংস্করণ তৈরি করে আপনি শিখবেন:

• ইমেজ সাইজ নিয়ে কিভাবে কাজ করবেন
• Drag'n'Drop API-এর মূল বিষয়গুলি জানুন৷
• API এবং ইভেন্ট শ্রোতারা কীভাবে কাজ করে তা বুঝুন
• কিভাবে ফাইল আপলোড এবং এক্সপোর্ট করতে হয়

দ্রষ্টব্য: ইমেজ কম্প্রেসার স্থানীয়। সার্ভারে অতিরিক্ত ডেটা পাঠানোর প্রয়োজন নেই। আপনি বাড়িতে কম্প্রেসার রাখতে পারেন, অথবা আপনি এটি একটি সার্ভারে ব্যবহার করতে পারেন, আপনার পছন্দ।

গণক

চলে আসো? সিরিয়াসলি? ক্যালকুলেটর? হ্যাঁ, ঠিক, একটি ক্যালকুলেটর। গণিত ক্রিয়াকলাপের মূল বিষয়গুলি বোঝা এবং তারা কীভাবে একসাথে কাজ করে তা আপনার অ্যাপ্লিকেশনগুলিকে সরল করার জন্য একটি গুরুত্বপূর্ণ দক্ষতা। শীঘ্রই বা পরে আপনাকে সংখ্যার সাথে মোকাবিলা করতে হবে এবং যত তাড়াতাড়ি ভাল।

jarodburchill.github.io/CalculatorReactApp

আপনার নিজের ক্যালকুলেটর তৈরি করে আপনি শিখবেন:

• সংখ্যা এবং গণিত অপারেশন সঙ্গে কাজ
• ইভেন্ট শ্রোতা API এর সাথে অনুশীলন করুন
• কিভাবে উপাদান সাজানো, শৈলী বুঝতে

ক্রলার (সার্চ ইঞ্জিন)

সবাই একটি সার্চ ইঞ্জিন ব্যবহার করেছে, তাহলে কেন আপনার নিজের তৈরি করবেন না? তথ্য অনুসন্ধানের জন্য ক্রলার প্রয়োজন। প্রত্যেকে প্রতিদিন তাদের ব্যবহার করে এবং এই প্রযুক্তি এবং বিশেষজ্ঞদের চাহিদা শুধুমাত্র সময়ের সাথে বৃদ্ধি পাবে।

গুগল সার্চ ইঞ্জিন

আপনার নিজের সার্চ ইঞ্জিন তৈরি করে আপনি যা শিখবেন:

• ক্রলার কিভাবে কাজ করে
• কিভাবে সাইট সূচী এবং কিভাবে রেটিং এবং খ্যাতি দ্বারা তাদের র্যাঙ্ক করা হয়
• কিভাবে একটি ডাটাবেসে সূচীকৃত সাইট সংরক্ষণ করবেন এবং কিভাবে ডাটাবেসের সাথে কাজ করবেন

মিউজিক প্লেয়ার (স্পটিফাই, অ্যাপল মিউজিক)

সবাই গান শোনে - এটা আমাদের জীবনের একটি অবিচ্ছেদ্য অংশ মাত্র। আধুনিক মিউজিক স্ট্রিমিং প্ল্যাটফর্মের বেসিক মেকানিক্স কীভাবে কাজ করে তা আরও ভালভাবে বুঝতে একটি মিউজিক প্লেয়ার তৈরি করা যাক।

Spotify এর

আপনার নিজের মিউজিক স্ট্রিমিং প্ল্যাটফর্ম তৈরি করে আপনি যা শিখবেন:

• API এর সাথে কিভাবে কাজ করবেন। Spotify বা Apple Music থেকে API ব্যবহার করুন
• কীভাবে খেলবেন, পরের/পূর্ববর্তী ট্র্যাকে বিরাম বা রিওয়াইন্ড করবেন
• ভলিউম পরিবর্তন কিভাবে
• ব্যবহারকারীর রাউটিং এবং ব্রাউজার ইতিহাস কীভাবে পরিচালনা করবেন

প্রতিক্রিয়া সহ মুভি অনুসন্ধান অ্যাপ্লিকেশন (হুক সহ)

আপনি প্রথম যে জিনিসটি দিয়ে শুরু করতে পারেন তা হল প্রতিক্রিয়া সহ একটি চলচ্চিত্র অনুসন্ধান অ্যাপ তৈরি করা। চূড়ান্ত অ্যাপটি কেমন হবে তার একটি চিত্র নীচে দেওয়া হল:

আপনি কি শিখবেন
এই অ্যাপ্লিকেশনটি তৈরি করে, আপনি তুলনামূলকভাবে নতুন হুক্স API ব্যবহার করে আপনার প্রতিক্রিয়া দক্ষতা উন্নত করবেন। নমুনা প্রকল্পটি প্রতিক্রিয়া উপাদান, প্রচুর হুক, একটি বাহ্যিক API এবং অবশ্যই কিছু CSS স্টাইলিং ব্যবহার করে।

টেক স্ট্যাক এবং বৈশিষ্ট্য

• হুক দিয়ে প্রতিক্রিয়া
• তৈরি-প্রতিক্রিয়া-অ্যাপ্লিকেশন
• JSX
• সিএসএস

কোনও ক্লাস ব্যবহার না করেই, এই প্রকল্পগুলি আপনাকে কার্যকরী প্রতিক্রিয়াতে নিখুঁত এন্ট্রি পয়েন্ট দেয় এবং 2020 সালে অবশ্যই আপনাকে সাহায্য করবে। তুমি খুজেঁ পাবে নমুনা প্রকল্প এখানে. নির্দেশাবলী অনুসরণ করুন বা এটি আপনার নিজের করুন.

Vue এর সাথে চ্যাট অ্যাপ

আপনার জন্য আরেকটি দুর্দান্ত প্রকল্প হল আমার প্রিয় জাভাস্ক্রিপ্ট লাইব্রেরি ব্যবহার করে একটি চ্যাট অ্যাপ তৈরি করা: VueJS। অ্যাপ্লিকেশনটি এরকম কিছু দেখাবে:

আপনি কি শিখবেন
এই টিউটোরিয়ালে, আপনি শিখবেন কীভাবে স্ক্র্যাচ থেকে একটি Vue অ্যাপ তৈরি করতে হয় - উপাদানগুলি তৈরি করুন, রাজ্যগুলি পরিচালনা করুন, রুট তৈরি করুন, তৃতীয় পক্ষের পরিষেবাগুলির সাথে সংযোগ করুন এবং এমনকি প্রমাণীকরণ পরিচালনা করুন৷

টেক স্ট্যাক এবং বৈশিষ্ট্য

• দৃশ্য
• ভেক্স
• ভিউ রাউটার
• ভ্যু সিএলআই
• বিমানপোত
• সিএসএস

এটি Vue এর সাথে শুরু করার জন্য বা 2020 সালে বিকাশে যাওয়ার জন্য আপনার বিদ্যমান দক্ষতা উন্নত করার জন্য সত্যিই একটি দুর্দান্ত প্রকল্প। তুমি খুজেঁ পাবে এখানে টিউটোরিয়াল.

Angular 8 সহ সুন্দর আবহাওয়া অ্যাপ

এই উদাহরণটি আপনাকে Angular 8 ব্যবহার করে একটি সুন্দর আবহাওয়া অ্যাপ তৈরি করতে সাহায্য করবে:

আপনি কি শিখবেন
এই প্রকল্পটি আপনাকে স্ক্র্যাচ থেকে অ্যাপ্লিকেশন তৈরিতে মূল্যবান দক্ষতা শেখাবে - ডিজাইন থেকে ডেভেলপমেন্ট, একটি রেডি-টু-ডিপ্লোয় অ্যাপ্লিকেশন পর্যন্ত।

টেক স্ট্যাক এবং বৈশিষ্ট্য

• কৌণিক এক্সএনইউএমএক্স
• Firebase
• সার্ভার সাইড রেন্ডারিং
• গ্রিড এবং ফ্লেক্সবক্স সহ CSS
• মোবাইল বন্ধুত্বপূর্ণ এবং অভিযোজনযোগ্যতা
• Режимый режим
• সুন্দর ইন্টারফেস

এই ব্যাপক প্রকল্প সম্পর্কে আমি সত্যিই যা পছন্দ করি তা হল আপনি বিচ্ছিন্নভাবে জিনিসগুলি অধ্যয়ন করবেন না। পরিবর্তে, আপনি ডিজাইন থেকে চূড়ান্ত স্থাপনা পর্যন্ত সম্পূর্ণ বিকাশ প্রক্রিয়া শিখুন।

Svelte-এর সাথে টু-ডু অ্যাপ

Svelte হল কম্পোনেন্ট পদ্ধতিতে নতুন বাচ্চার মত - অন্তত React, Vue এবং Angular এর মত। এবং এটি 2020 এর জন্য সবচেয়ে জনপ্রিয় নতুন পণ্যগুলির মধ্যে একটি।

টু-ডু অ্যাপগুলি অগত্যা সবচেয়ে আলোচিত বিষয় নয়, তবে সেগুলি আপনাকে আপনার স্ভেল্ট দক্ষতা বাড়াতে সাহায্য করবে। এটি এই মত দেখাবে:

আপনি কি শিখবেন
এই টিউটোরিয়ালটি আপনাকে দেখাবে কিভাবে Svelte 3 ব্যবহার করে একটি অ্যাপ্লিকেশন তৈরি করতে হয়, শুরু থেকে শেষ পর্যন্ত। আপনি উপাদান, স্টাইলিং এবং ইভেন্ট হ্যান্ডলার ব্যবহার করবেন

টেক স্ট্যাক এবং বৈশিষ্ট্য

• স্ভেল্ট 3
• উপাদান
• CSS দিয়ে স্টাইল করা
• সিনট্যাক্স ES6

অনেক ভাল Svelte স্টার্টার প্রকল্প নেই, তাই আমি খুঁজে পেয়েছি এই শুরু করার একটি ভাল জায়গা.

Next.js সহ ইকমার্স অ্যাপ

Next.js হল রিঅ্যাক্ট অ্যাপ তৈরির জন্য সবচেয়ে জনপ্রিয় ফ্রেমওয়ার্ক যা সার্ভার-সাইড রেন্ডারিংকে বক্সের বাইরে সমর্থন করে।

এই প্রকল্পটি আপনাকে দেখাবে কিভাবে একটি ই-কমার্স অ্যাপ্লিকেশন তৈরি করতে হয় যা দেখতে এইরকম:

আপনি কি শিখবেন
এই প্রকল্পে, আপনি Next.js-এর সাহায্যে কীভাবে বিকাশ করবেন তা শিখবেন—নতুন পৃষ্ঠা এবং উপাদান তৈরি করুন, ডেটা পুনরুদ্ধার করুন এবং স্টাইল করুন এবং একটি পরবর্তী অ্যাপ্লিকেশন স্থাপন করুন।

টেক স্ট্যাক এবং বৈশিষ্ট্য

• পরবর্তী.js
• উপাদান এবং পৃষ্ঠা
• ডেটা স্যাম্পলিং
• stylization
• প্রকল্প স্থাপনা
• এসএসআর এবং এসপিএ

নতুন কিছু শেখার জন্য ই-কমার্স অ্যাপের মতো বাস্তব-জীবনের উদাহরণ পাওয়া সবসময়ই দারুণ। তুমি পারবে এখানে টিউটোরিয়াল খুঁজুন.

Nuxt.js সহ সম্পূর্ণ বহুভাষিক ব্লগ

Nuxt.js হল Vue-এর জন্য, যেমন Next.js হল প্রতিক্রিয়ার জন্য: সার্ভার-সাইড রেন্ডারিং এবং একক-পৃষ্ঠা অ্যাপ্লিকেশনগুলিকে একত্রিত করার জন্য একটি দুর্দান্ত কাঠামো
আপনি যে শেষ অ্যাপ্লিকেশনটি তৈরি করতে পারেন তা দেখতে এইরকম হবে:

আপনি কি শিখবেন

এই নমুনা প্রকল্পে, আপনি প্রাথমিক সেটআপ থেকে চূড়ান্ত স্থাপনা পর্যন্ত Nuxt.js ব্যবহার করে একটি সম্পূর্ণ ওয়েবসাইট তৈরি করতে শিখবেন।

এটি Nuxt-এর অফার করে এমন অনেকগুলি দুর্দান্ত বৈশিষ্ট্যের সুবিধা নেয়, যেমন পৃষ্ঠা এবং উপাদানগুলি এবং SCSS এর সাথে স্টাইলিং।

টেক স্ট্যাক এবং বৈশিষ্ট্য

• Nuxt.js
• উপাদান এবং পৃষ্ঠা
• স্টোরিব্লক মডিউল
• মিক্সিন
• রাষ্ট্র পরিচালনার জন্য Vuex
• স্টাইলিং জন্য SCSS
• Nuxt Middlewares

এটি একটি সত্যিই দুর্দান্ত প্রকল্প।, যার মধ্যে Nuxt.js এর অনেকগুলি দুর্দান্ত বৈশিষ্ট্য রয়েছে৷ আমি ব্যক্তিগতভাবে Nuxt এর সাথে কাজ করতে পছন্দ করি তাই আপনার এটি চেষ্টা করা উচিত কারণ এটি আপনাকে একজন দুর্দান্ত Vue বিকাশকারীও করে তুলবে।

Gatsby সঙ্গে ব্লগ

Gatsby React এবং GraphQL ব্যবহার করে একটি দুর্দান্ত স্ট্যাটিক সাইট জেনারেটর। এই প্রকল্পের ফলাফল:

আপনি কি শিখবেন

এই টিউটোরিয়ালে, আপনি কীভাবে একটি ব্লগ তৈরি করতে গ্যাটসবি ব্যবহার করবেন তা শিখবেন যা আপনি প্রতিক্রিয়া এবং গ্রাফকিউএল ব্যবহার করে আপনার নিজের নিবন্ধগুলি লিখতে ব্যবহার করবেন।

টেক স্ট্যাক এবং বৈশিষ্ট্য

• গ্যাটসবি
• প্রতিক্রিয়া
• গ্রাফকিউএল
• প্লাগইন এবং থিম
• MDX/মার্কডাউন
• বুটস্ট্র্যাপ সিএসএস
• টেমপ্লেট

আপনি যদি কখনও একটি ব্লগ শুরু করতে চান, এটি একটি বড় উদাহরণ রিঅ্যাক্ট এবং গ্রাফকিউএল ব্যবহার করে কীভাবে এটি তৈরি করবেন।

আমি বলছি না যে ওয়ার্ডপ্রেস একটি খারাপ পছন্দ, তবে গ্যাটসবি দিয়ে আপনি প্রতিক্রিয়া ব্যবহার করে উচ্চ কার্যকারিতা ওয়েবসাইট তৈরি করতে পারেন - যা একটি আশ্চর্যজনক সংমিশ্রণ।

Gridsome সঙ্গে ব্লগ

Vue-এর জন্য গ্রিডসাম... ঠিক আছে, আমরা ইতিমধ্যেই নেক্সট/নক্সট এর সাথে এটি পেয়েছি।
তবে গ্রিডসাম এবং গ্যাটসবির ক্ষেত্রেও একই কথা প্রযোজ্য। উভয়ই তাদের ডেটা স্তর হিসাবে গ্রাফকিউএল ব্যবহার করে, তবে গ্রিডসোম VueJS ব্যবহার করে। এটি আপনাকে দুর্দান্ত ব্লগ তৈরি করতে সহায়তা করার জন্য একটি দুর্দান্ত স্ট্যাটিক সাইট জেনারেটর:

আপনি কি শিখবেন

গ্রিডসম, গ্রাফকিউএল এবং মার্কডাউন দিয়ে শুরু করার জন্য কীভাবে একটি সাধারণ ব্লগ তৈরি করতে হয় এই প্রকল্পটি আপনাকে শেখাবে। এটি নেটলিফাই এর মাধ্যমে কীভাবে একটি অ্যাপ্লিকেশন স্থাপন করতে হয় তাও ব্যাখ্যা করে।

টেক স্ট্যাক এবং বৈশিষ্ট্য

• গ্রিডসাম
• দৃশ্য
• গ্রাফকিউএল
• Markdown
• নেটলিফাই

এটি অবশ্যই সবচেয়ে সম্পূর্ণ টিউটোরিয়াল নয়, তবে এটি গ্রিডসম এবং এর মৌলিক ধারণাগুলিকে কভার করে মার্কডাউন এবং একটি ভাল সূচনা পয়েন্ট হতে পারে.

কোয়াসার ব্যবহার করে সাউন্ডক্লাউডের মতো অডিও প্লেয়ার

Quasar হল আরেকটি Vue ফ্রেমওয়ার্ক যা মোবাইল অ্যাপ তৈরি করতে ব্যবহার করা যেতে পারে। এই প্রকল্পে, আপনি একটি অডিও প্লেয়ার অ্যাপ্লিকেশন তৈরি করবেন যেমন:

আপনি কি শিখবেন

যদিও অন্যান্য প্রকল্পগুলি বেশিরভাগ ওয়েব অ্যাপগুলিতে ফোকাস করে, এটি আপনাকে দেখাবে কিভাবে Vue এবং Quasar ফ্রেমওয়ার্ক ব্যবহার করে একটি মোবাইল অ্যাপ তৈরি করতে হয়।
আপনার ইতিমধ্যেই Android Studio/Xcode সেট আপ সহ একটি কার্যকরী কর্ডোভা থাকা উচিত৷ যদি না হয়, ম্যানুয়ালটিতে Quasar ওয়েবসাইটের একটি লিঙ্ক রয়েছে যেখানে তারা আপনাকে দেখায় কিভাবে সবকিছু সেট আপ করতে হয়।

টেক স্ট্যাক এবং বৈশিষ্ট্য

• কোয়েসার
• দৃশ্য
• Cordova
• ওয়েভসার্ফার
• UI উপাদান

ছোট প্রকল্প, মোবাইল অ্যাপ্লিকেশন তৈরির জন্য কোয়াসারের ক্ষমতা প্রদর্শন করে।

ক্রেডিট কার্ড ফর্ম

মসৃণ এবং আনন্দদায়ক মাইক্রো ইন্টারঅ্যাকশন সহ একটি দুর্দান্ত ক্রেডিট কার্ড আকৃতি। নম্বর বিন্যাস, যাচাইকরণ এবং স্বয়ংক্রিয় কার্ড প্রকার সনাক্তকরণ অন্তর্ভুক্ত। এটি Vue.js-এ নির্মিত এবং এটি সম্পূর্ণরূপে প্রতিক্রিয়াশীল। (তুমি দেখতে পার এখানে.)

ক্রেডিট-কার্ড-ফর্ম

আপনি যা শিখবেন:

• প্রক্রিয়া এবং ফর্ম যাচাই
• ইভেন্টগুলি পরিচালনা করুন (উদাহরণস্বরূপ, যখন ক্ষেত্র পরিবর্তন হয়)
• পৃষ্ঠায় উপাদানগুলি কীভাবে প্রদর্শন এবং স্থাপন করতে হয় তা বুঝুন, বিশেষত ফর্মের উপরে প্রদর্শিত ক্রেডিট কার্ডের তথ্য

বার চার্ট

একটি হিস্টোগ্রাম হল একটি চার্ট বা গ্রাফ যা তারা প্রতিনিধিত্ব করে এমন মানগুলির সমানুপাতিক উচ্চতা বা দৈর্ঘ্য সহ আয়তক্ষেত্রাকার বার সহ শ্রেণীবদ্ধ ডেটা উপস্থাপন করে।

এগুলি উল্লম্বভাবে বা অনুভূমিকভাবে প্রয়োগ করা যেতে পারে। একটি উল্লম্ব বার চার্টকে কখনও কখনও লাইন চার্ট বলা হয়।

আপনি যা শিখবেন:

• একটি কাঠামোগত এবং বোধগম্য উপায়ে ডেটা প্রদর্শন করুন
• অতিরিক্তভাবে: উপাদানটি কীভাবে ব্যবহার করবেন তা শিখুন canvas এবং কিভাবে এটি দিয়ে উপাদান আঁকা

এটা হল আপনি বিশ্বের জনসংখ্যা তথ্য খুঁজে পেতে পারেন. তারা বছর অনুসারে সাজানো হয়।

টুইটার হার্ট অ্যানিমেশন

2016 সালে, টুইটার তার টুইটগুলির জন্য এই আশ্চর্যজনক অ্যানিমেশনটি চালু করেছিল। 2019 এর হিসাবে, এটি এখনও অংশটি দেখায়, তাহলে কেন নিজেই একটি তৈরি করবেন না?

আপনি যা শিখবেন:

• CSS অ্যাট্রিবিউট নিয়ে কাজ করুন keyframes
• ম্যানিপুলেট এবং HTML উপাদান অ্যানিমেট
• জাভাস্ক্রিপ্ট, এইচটিএমএল এবং সিএসএস একত্রিত করুন

অনুসন্ধানযোগ্য GitHub সংগ্রহস্থল

এখানে অভিনব কিছু নেই — GitHub সংগ্রহস্থলগুলি কেবল একটি মহিমান্বিত তালিকা।
লক্ষ্য হল সংগ্রহস্থলগুলি প্রদর্শন করা এবং ব্যবহারকারীকে সেগুলি ফিল্টার করার অনুমতি দেওয়া। ব্যবহার করুন অফিসিয়াল GitHub API প্রতিটি ব্যবহারকারীর জন্য সংগ্রহস্থল পেতে.

GitHub প্রোফাইল পৃষ্ঠা - github.com/indreklasn

আপনি যা শিখবেন:

• API থেকে ডেটা গ্রহণ করুন
• API থেকে ডেটা প্রদর্শন করুন
• ফিল্টার করুন এবং প্রতিটি অনুসন্ধানের জন্য প্রাসঙ্গিক ডেটা দেখান
• ঐচ্ছিক: আপনি যদি একটি চ্যালেঞ্জের জন্য প্রস্তুত হন তবে ব্যবহার করুন API v4, GraphQL ব্যবহার করে নির্মিত। আপনি যদি গ্রাফকিউএল শিখতে চান তবে আমার আগের নিবন্ধগুলির একটিতে যান.

Reddit শৈলী চ্যাট

চ্যাট তাদের সরলতা এবং ব্যবহারের সহজতার কারণে যোগাযোগের একটি জনপ্রিয় উপায়। কিন্তু কি সত্যিই আধুনিক চ্যাট রুম জ্বালানী? ওয়েবসকেটগুলি !

আপনি যা শিখবেন:

• WebSockets, রিয়েল-টাইম যোগাযোগ এবং ডেটা আপডেট ব্যবহার করুন
• ব্যবহারকারীর অ্যাক্সেসের স্তরগুলির সাথে কাজ করুন (উদাহরণস্বরূপ, একটি চ্যাট চ্যানেলের মালিকের ভূমিকা রয়েছে৷ admin, এবং রুমে অন্যরা - user)
• ফর্ম প্রক্রিয়া এবং যাচাই করুন - মনে রাখবেন, একটি বার্তা পাঠানোর জন্য চ্যাট উইন্ডো input
• বিভিন্ন চ্যাট তৈরি করুন এবং যোগদান করুন
• ব্যক্তিগত বার্তা সঙ্গে কাজ. ব্যবহারকারীরা অন্যান্য ব্যবহারকারীদের সাথে ব্যক্তিগতভাবে চ্যাট করতে পারেন। মূলত, আপনি দুটি ব্যবহারকারীর মধ্যে একটি WebSocket সংযোগ স্থাপন করবেন।

স্ট্রাইপ শৈলী নেভিগেশন

যা এই নেভিগেশনটিকে অনন্য করে তোলে তা হল যে পপওভার কন্টেইনার সামগ্রীর সাথে মানানসই রূপান্তরিত হয়৷ একটি নতুন পপওভার খোলা এবং বন্ধ করার ঐতিহ্যগত আচরণের তুলনায় এই রূপান্তরের একটি কমনীয়তা রয়েছে।

আপনি যা শিখবেন:

• ট্রানজিশনের সাথে CSS অ্যানিমেশন একত্রিত করুন
• কন্টেন্ট ম্লান করুন এবং ভাসমান উপাদানে সক্রিয় শ্রেণী প্রয়োগ করুন

Pacman

প্যাকম্যানের নিজস্ব সংস্করণ তৈরি করুন। গেমগুলি কীভাবে বিকাশ করা হয় এবং মূল বিষয়গুলি বোঝার ধারণা পাওয়ার এটি একটি দুর্দান্ত উপায়। একটি জাভাস্ক্রিপ্ট ফ্রেমওয়ার্ক, প্রতিক্রিয়া বা Vue ব্যবহার করুন।

তুমি শিখবে:

• কিভাবে উপাদান সরানো
• কোন কী টিপতে হবে তা কীভাবে নির্ধারণ করবেন
• সংঘর্ষের মুহূর্তটি কীভাবে নির্ধারণ করবেন
• আপনি আরও যেতে পারেন এবং ভূত আন্দোলন নিয়ন্ত্রণ যোগ করতে পারেন

আপনি এই প্রকল্পের একটি উদাহরণ পাবেন ভান্ডারে GitHub

ইউজার ম্যানেজমেন্ট

প্রকল্পটি ভান্ডারে GitHub

ব্যবহারকারী প্রশাসনের জন্য একটি CRUD টাইপ অ্যাপ্লিকেশন তৈরি করা আপনাকে বিকাশের মূল বিষয়গুলি শেখাবে৷ এটি নতুন বিকাশকারীদের জন্য বিশেষভাবে কার্যকর।

তুমি শিখবে:

• রাউটিং কি
• ডেটা এন্ট্রি ফর্মগুলি কীভাবে পরিচালনা করবেন এবং ব্যবহারকারী কী প্রবেশ করেছেন তা পরীক্ষা করুন
• ডাটাবেসের সাথে কীভাবে কাজ করবেন - ক্রিয়া তৈরি করুন, পড়ুন, আপডেট করুন এবং মুছুন

আপনার অবস্থানে আবহাওয়া পরীক্ষা করা হচ্ছে

প্রকল্পটি ভান্ডারে GitHub

আপনি যদি অ্যাপ তৈরি করতে চান তবে একটি আবহাওয়া অ্যাপ দিয়ে শুরু করুন। এই প্রকল্পটি সুইফট ব্যবহার করে সম্পন্ন করা যেতে পারে।

একটি অ্যাপ্লিকেশন তৈরির অভিজ্ঞতা অর্জনের পাশাপাশি, আপনি শিখবেন:

• API এর সাথে কিভাবে কাজ করবেন
• ভূ-অবস্থান কিভাবে ব্যবহার করবেন
• টেক্সট ইনপুট যোগ করে আপনার অ্যাপ্লিকেশনকে আরও গতিশীল করুন। এটিতে, ব্যবহারকারীরা একটি নির্দিষ্ট স্থানে আবহাওয়া পরীক্ষা করতে তাদের অবস্থান প্রবেশ করতে সক্ষম হবেন।

আপনার একটি API প্রয়োজন হবে। আবহাওয়ার তথ্য পেতে, OpenWeather API ব্যবহার করুন। OpenWeather API সম্পর্কে আরও তথ্য এখানে.

চ্যাট উইন্ডো

আমার চ্যাট উইন্ডো কার্যত, দুটি ব্রাউজার ট্যাবে খুলুন

একটি চ্যাট উইন্ডো তৈরি করা সকেট দিয়ে শুরু করার নিখুঁত উপায়। টেক স্ট্যাকের পছন্দ বিশাল। Node.js, উদাহরণস্বরূপ, নিখুঁত.

আপনি শিখবেন কিভাবে সকেট কাজ করে এবং কিভাবে তাদের বাস্তবায়ন করতে হয়। এটি এই প্রকল্পের প্রধান সুবিধা।

আপনি যদি লারাভেল ডেভেলপার হন যিনি সকেট নিয়ে কাজ করতে চান, আমার পড়ুন প্রবন্ধ

গিটল্যাব সিআই

উৎস

আপনি যদি ক্রমাগত ইন্টিগ্রেশনে (CI) নতুন হয়ে থাকেন, GitLab CI এর সাথে খেলুন। কয়েকটি পরিবেশ সেট আপ করুন এবং কয়েকটি পরীক্ষা চালানোর চেষ্টা করুন। এটি একটি খুব কঠিন প্রকল্প নয়, তবে আমি নিশ্চিত যে আপনি এটি থেকে অনেক কিছু শিখবেন। অনেক উন্নয়ন দল এখন CI ব্যবহার করছে। এটি কীভাবে ব্যবহার করবেন তা জেনে রাখা দরকারী।

তুমি শিখবে:

• গিটল্যাব সিআই কি?
• কিভাবে কনফিগার করবেন .gitlab-ci.ymlযা GitLab ব্যবহারকারীকে কী করতে হবে তা বলে
• অন্যান্য পরিবেশে কিভাবে স্থাপন করা যায়

ওয়েবসাইট বিশ্লেষক

একটি স্ক্র্যাপার তৈরি করুন যা ওয়েবসাইটের শব্দার্থ বিশ্লেষণ করে এবং তাদের রেটিং তৈরি করে। উদাহরণস্বরূপ, আপনি চিত্রগুলিতে অনুপস্থিত alt ট্যাগগুলি পরীক্ষা করতে পারেন৷ অথবা পৃষ্ঠাটিতে SEO মেটা ট্যাগ আছে কিনা তা পরীক্ষা করুন। একটি স্ক্র্যাপার একটি ব্যবহারকারী ইন্টারফেস ছাড়া তৈরি করা যেতে পারে.

তুমি শিখবে:

• কিভাবে স্ক্র্যাপার কাজ করে?
• কিভাবে DOM নির্বাচক তৈরি করবেন
• কিভাবে একটি অ্যালগরিদম লিখতে হয়
• আপনি যদি সেখানে থামতে না চান তবে একটি ইউজার ইন্টারফেস তৈরি করুন। আপনি চেক করা প্রতিটি ওয়েবসাইটে একটি প্রতিবেদনও তৈরি করতে পারেন।

সামাজিক নেটওয়ার্কে অনুভূতি সনাক্তকরণ

উৎস

সোশ্যাল মিডিয়াতে সেন্টিমেন্ট ডিটেকশন মেশিন লার্নিং এর সাথে পরিচিত হওয়ার একটি দুর্দান্ত উপায়।

আপনি শুধুমাত্র একটি সামাজিক নেটওয়ার্ক বিশ্লেষণ করে শুরু করতে পারেন। সবাই সাধারণত টুইটার দিয়ে শুরু করে।

আপনার যদি ইতিমধ্যেই মেশিন লার্নিংয়ের অভিজ্ঞতা থাকে, তাহলে বিভিন্ন সামাজিক নেটওয়ার্ক থেকে ডেটা সংগ্রহ করে সেগুলোকে একত্রিত করার চেষ্টা করুন।

তুমি শিখবে:

• মেশিন লার্নিং কি

ট্রেলো ক্লোন

ইন্দ্রেক লাসন থেকে ট্রেলো ক্লোন।

আপনি যা শিখবেন:

• অনুরোধ প্রক্রিয়াকরণ রুটগুলির সংগঠন (রাউটিং)।
• টানা এবং পতন.
• কিভাবে নতুন বস্তু (বোর্ড, তালিকা, কার্ড) তৈরি করতে হয়।
• ইনপুট ডেটা প্রক্রিয়াকরণ এবং পরীক্ষা করা হচ্ছে।
• ক্লায়েন্টের দিক থেকে: কীভাবে স্থানীয় স্টোরেজ ব্যবহার করবেন, কীভাবে স্থানীয় স্টোরেজে ডেটা সংরক্ষণ করবেন, কীভাবে স্থানীয় স্টোরেজ থেকে ডেটা পড়তে হবে।
• সার্ভারের দিক থেকে: কিভাবে ডাটাবেস ব্যবহার করতে হয়, কিভাবে ডাটাবেসে ডাটা সেভ করতে হয়, ডাটাবেস থেকে ডাটা কিভাবে পড়তে হয়।

এখানে একটি সংগ্রহস্থল একটি উদাহরণ, React+Redux-এ তৈরি।

অ্যাডমিন প্যানেল

Github সংগ্রহস্থল।

একটি সাধারণ CRUD অ্যাপ্লিকেশন, মৌলিক বিষয়গুলো শেখার জন্য আদর্শ। আসুন জেনে নিইঃ

• ব্যবহারকারী তৈরি করুন, ব্যবহারকারীদের পরিচালনা করুন।
• ডাটাবেসের সাথে ইন্টারঅ্যাক্ট করুন - ব্যবহারকারী তৈরি করুন, পড়ুন, সম্পাদনা করুন, মুছুন।
• ইনপুট যাচাই করা এবং ফর্মগুলির সাথে কাজ করা।

ক্রিপ্টোকারেন্সি ট্র্যাকার (নেটিভ মোবাইল অ্যাপ)

Github সংগ্রহস্থল।

যেকোনো কিছু: সুইফট, অবজেক্টিভ-সি, রিঅ্যাক্ট নেটিভ, জাভা, কোটলিন।

আসুন অধ্যয়ন:

• নেটিভ অ্যাপ্লিকেশন কিভাবে কাজ করে।
• কিভাবে API থেকে ডেটা পুনরুদ্ধার করবেন।
• নেটিভ পেজ লেআউট কিভাবে কাজ করে।
• মোবাইল সিমুলেটর দিয়ে কিভাবে কাজ করবেন।

এই API চেষ্টা করুন. আপনি যদি আরও ভাল কিছু খুঁজে পান তবে মন্তব্যে লিখুন।

আপনি আগ্রহী হলে, এটি এখানে এখানে একটি টিউটোরিয়াল আছে.

স্ক্র্যাচ থেকে আপনার নিজস্ব ওয়েবপ্যাক কনফিগারেশন সেট আপ করুন

প্রযুক্তিগতভাবে, এটি একটি অ্যাপ্লিকেশন নয়, তবে ওয়েবপ্যাকটি ভিতরে থেকে কীভাবে কাজ করে তা বোঝার জন্য এটি একটি খুব দরকারী কাজ। এখন এটি একটি "ব্ল্যাক বক্স" নয়, একটি বোধগম্য টুল হবে।

প্রয়োজনীয়তা:

• es7 থেকে es5 (বেসিক) কম্পাইল করুন।
• jsx থেকে js - অথবা - .vue থেকে .js কম্পাইল করুন (আপনাকে লোডার শিখতে হবে)
• ওয়েবপ্যাক ডেভ সার্ভার এবং হট মডিউল পুনরায় লোডিং সেট আপ করুন৷ (vue-cli এবং create-react-app উভয়ই ব্যবহার করুন)
• Heroku, now.sh বা Github ব্যবহার করুন, ওয়েবপ্যাক প্রকল্পগুলি কীভাবে স্থাপন করতে হয় তা শিখুন।
• CSS - scss, less, stylus কম্পাইল করতে আপনার প্রিয় প্রিপ্রসেসর সেট আপ করুন।
• ওয়েবপ্যাকের সাথে ইমেজ এবং এসভিজি ব্যবহার করতে শিখুন।

এটি সম্পূর্ণ নতুনদের জন্য একটি আশ্চর্যজনক সম্পদ।

হ্যাকারনিউজ ক্লোন

প্রতিটি জেডিকে তার নিজস্ব হ্যাকারনিউজ তৈরি করতে হবে।

পথে আপনি যা শিখবেন:

• হ্যাকারনিউজ এপিআই এর সাথে কিভাবে ইন্টারঅ্যাক্ট করবেন।
• কিভাবে একটি একক পৃষ্ঠা অ্যাপ্লিকেশন তৈরি করতে হয়।
• মন্তব্য, পৃথক মন্তব্য, প্রোফাইল দেখার মতো বৈশিষ্ট্যগুলি কীভাবে প্রয়োগ করবেন।
• অনুরোধ প্রক্রিয়াকরণ রুটগুলির সংগঠন (রাউটিং)।

টুডুশেচকা

TodoMVC.

সিরিয়াসলি? টুদুশকা? তাদের হাজার হাজার আছে. তবে বিশ্বাস করুন, এই জনপ্রিয়তার একটি কারণ আছে।
আপনি বুনিয়াদি বুঝতে পেরেছেন তা নিশ্চিত করার জন্য Tudu অ্যাপটি একটি দুর্দান্ত উপায়। একটি অ্যাপ্লিকেশন ভ্যানিলা জাভাস্ক্রিপ্টে এবং একটি আপনার প্রিয় কাঠামোতে লেখার চেষ্টা করুন।

শিখুন:

• নতুন কাজ তৈরি করুন।
• ক্ষেত্রগুলি পূরণ করা হয়েছে কিনা তা পরীক্ষা করুন।
• ফিল্টার টাস্ক (সমাপ্ত, সক্রিয়, সব)। ব্যবহার করুন filter и reduce.
• জাভাস্ক্রিপ্টের বুনিয়াদি বুঝুন।

বাছাইযোগ্য ড্র্যাগ এবং ড্রপ তালিকা

Github সংগ্রহস্থল।

বুঝতে খুব সহায়ক এপিআই টেনে আনুন.

আসুন জেনে নিইঃ

• API টানুন এবং ড্রপ করুন
• সমৃদ্ধ UI তৈরি করুন

মেসেঞ্জার ক্লোন (নেটিভ অ্যাপ)

আপনি বুঝতে পারবেন কিভাবে ওয়েব অ্যাপ্লিকেশন এবং নেটিভ অ্যাপ্লিকেশন উভয়ই কাজ করে, যা আপনাকে ধূসর ভর থেকে আলাদা করবে।

আমরা যা অধ্যয়ন করব:

• ওয়েব সকেট (তাত্ক্ষণিক বার্তা)
• নেটিভ অ্যাপ্লিকেশন কিভাবে কাজ করে।
• কিভাবে টেমপ্লেট নেটিভ অ্যাপ্লিকেশনে কাজ করে।
• নেটিভ অ্যাপ্লিকেশনে অনুরোধ প্রক্রিয়াকরণ রুট সংগঠিত করা।

টেক্সট সম্পাদক

একটি পাঠ্য সম্পাদকের উদ্দেশ্য হল ব্যবহারকারীদের তাদের বিন্যাসকে বৈধ HTML মার্কআপে রূপান্তর করার প্রচেষ্টাকে হ্রাস করা। একটি ভালো টেক্সট এডিটর ব্যবহারকারীদের বিভিন্ন উপায়ে টেক্সট ফরম্যাট করতে দেয়।

কিছু সময়ে, সবাই একটি পাঠ্য সম্পাদক ব্যবহার করেছে। তাই কেন না এটি নিজেই তৈরি করুন?

রেডডিট ক্লোন

Reddit একটি সামাজিক সংবাদ একত্রীকরণ, ওয়েব সামগ্রী রেটিং এবং আলোচনার সাইট।

রেডডিট আমার বেশিরভাগ সময় নেয়, তবে আমি এটিতে হ্যাংআউট করতে থাকি। একটি Reddit ক্লোন তৈরি করা প্রোগ্রামিং শেখার একটি কার্যকর উপায় (একই সময়ে Reddit ব্রাউজ করার সময়)।

Reddit একটি খুব সমৃদ্ধ সঙ্গে আপনি প্রদান করে এপিআই. কোনো বৈশিষ্ট্য ত্যাগ করবেন না বা এলোমেলোভাবে কাজ করবেন না। ক্লায়েন্ট এবং গ্রাহকদের সাথে বাস্তব জগতে, আপনি এলোমেলোভাবে কাজ করতে পারবেন না, অথবা আপনি দ্রুত আপনার চাকরি হারাবেন।

স্মার্ট ক্লায়েন্টরা অবিলম্বে বুঝতে পারবে যে কাজটি খারাপভাবে করা হচ্ছে এবং অন্য কাউকে খুঁজে পাবে।

Reddit API

একটি ওপেন সোর্স NPM প্যাকেজ প্রকাশ করা হচ্ছে

আপনি যদি জাভাস্ক্রিপ্ট কোড লেখেন, তাহলে সম্ভবত আপনি একটি প্যাকেজ ম্যানেজার ব্যবহার করেন। একটি প্যাকেজ ম্যানেজার আপনাকে বিদ্যমান কোডটি পুনরায় ব্যবহার করার অনুমতি দেয় যা অন্য লোকেরা লিখেছেন এবং প্রকাশ করেছেন।

একটি প্যাকেজের সম্পূর্ণ বিকাশ চক্র বোঝা একটি খুব ভাল অভিজ্ঞতা প্রদান করবে। কোড প্রকাশ করার সময় আপনাকে অনেক কিছু জানতে হবে। আপনাকে নিরাপত্তা, শব্দার্থিক সংস্করণ, স্কেলেবিলিটি, নামকরণের নিয়মাবলী এবং রক্ষণাবেক্ষণ সম্পর্কে চিন্তা করতে হবে।

প্যাকেজ যেকোনো কিছু হতে পারে। যদি আপনার কোন ধারণা না থাকে, তাহলে আপনার নিজস্ব Lodash তৈরি করুন এবং এটি প্রকাশ করুন।

লোদাশ: lodash.com

আপনি অনলাইনে কিছু করেছেন তা আপনাকে অন্যদের উপরে 10% রাখে। এখানে কিছু দরকারী সম্পদ আছে ওপেন সোর্স এবং প্যাকেজ সম্পর্কে।

ফ্রিকোডক্যাম্প পাঠ্যক্রম

FCC পাঠ্যক্রম

freeCodecamp অনেক সংগ্রহ করেছে ব্যাপক প্রোগ্রামিং কোর্স.

freeCodeCamp একটি অলাভজনক সংস্থা। এটি একটি ইন্টারেক্টিভ ওয়েব-ভিত্তিক লার্নিং প্ল্যাটফর্ম, একটি অনলাইন কমিউনিটি ফোরাম, চ্যাট রুম, মিডিয়াম প্রকাশনা এবং স্থানীয় সংস্থাগুলি নিয়ে গঠিত যা ওয়েব ডেভেলপমেন্ট শেখার জন্য সবার কাছে অ্যাক্সেসযোগ্য করে তুলতে চায়।

আপনি যদি সম্পূর্ণ কোর্সটি সম্পূর্ণ করতে পরিচালনা করেন তবে আপনি আপনার প্রথম কাজের জন্য যোগ্য হতে হবেন।

স্ক্র্যাচ থেকে একটি HTTP সার্ভার তৈরি করুন

HTTP প্রোটোকল হল একটি প্রধান প্রোটোকল যার মাধ্যমে বিষয়বস্তু ইন্টারনেটে ভ্রমণ করে। এইচটিটিপি সার্ভারগুলি এইচটিএমএল, সিএসএস এবং জেএস এর মতো স্ট্যাটিক সামগ্রী পরিবেশন করতে ব্যবহৃত হয়।

স্ক্র্যাচ থেকে HTTP প্রোটোকল বাস্তবায়ন করতে সক্ষম হওয়া জিনিসগুলি কীভাবে ইন্টারঅ্যাক্ট করে সে সম্পর্কে আপনার জ্ঞানকে প্রসারিত করবে।

উদাহরণস্বরূপ, আপনি যদি NodeJs ব্যবহার করেন, তাহলে আপনি জানেন যে Express একটি HTTP সার্ভার প্রদান করে।

রেফারেন্সের জন্য, আপনি পারেন কিনা দেখুন:

• কোনো লাইব্রেরি ব্যবহার না করে একটি সার্ভার সেট আপ করুন
• সার্ভার অবশ্যই এইচটিএমএল, সিএসএস এবং জেএস সামগ্রী পরিবেশন করবে।
• স্ক্র্যাচ থেকে একটি রাউটার বাস্তবায়ন
• পরিবর্তনগুলি পর্যবেক্ষণ করুন এবং সার্ভার আপডেট করুন

আপনি কেন জানেন না, ব্যবহার করুন যাও এবং একটি HTTP সার্ভার তৈরি করার চেষ্টা করুন চা রাখিবার আধার গোড়া থেকে

নোটের জন্য ডেস্কটপ অ্যাপ

আমরা সবাই নোট করি, তাই না?

আসুন একটি নোট অ্যাপ তৈরি করি। অ্যাপ্লিকেশনটিকে নোটগুলি সংরক্ষণ করতে হবে এবং সেগুলিকে ডাটাবেসের সাথে সিঙ্ক্রোনাইজ করতে হবে। ইলেক্ট্রন, সুইফ্ট বা আপনার যা পছন্দ এবং যা আপনার সিস্টেমের জন্য কাজ করে তা ব্যবহার করে একটি নেটিভ অ্যাপ তৈরি করুন।

প্রথম চ্যালেঞ্জ (টেক্সট এডিটর) এর সাথে এটিকে নির্দ্বিধায় একত্রিত করুন।

একটি বোনাস হিসাবে, ওয়েব সংস্করণের সাথে আপনার ডেস্কটপ সংস্করণ সিঙ্ক করার চেষ্টা করুন৷

পডকাস্ট (ওভারকাস্ট ক্লোন)

কে পডকাস্ট শোনে না?

নিম্নলিখিত কার্যকারিতা সহ একটি ওয়েব অ্যাপ্লিকেশন তৈরি করুন:

• একটি অ্যাকাউন্ট তৈরি করুন
• পডকাস্ট অনুসন্ধান করুন
• রেট এবং পডকাস্ট সদস্যতা
• 30 সেকেন্ডের জন্য থামুন এবং খেলুন, গতি পরিবর্তন করুন, এগিয়ে এবং পিছনের ফাংশনগুলি পরিবর্তন করুন।

একটি সূচনা পয়েন্ট হিসাবে iTunes API ব্যবহার করার চেষ্টা করুন. আপনি যদি অন্য কোন সম্পদ জানেন, মন্তব্য পোস্ট করুন.

affiliate.itunes.apple.com/resources/documentation/itunes-store-web-service-search-api

স্ক্রিন ক্যাপচার

হ্যালো! আমি এই মুহূর্তে আমার পর্দায় চিত্রগ্রহণ করছি!

একটি ডেস্কটপ বা ওয়েব অ্যাপ তৈরি করুন যা আপনাকে আপনার স্ক্রীন ক্যাপচার করতে এবং ক্লিপটিকে এই হিসাবে সংরক্ষণ করতে দেয়৷ .gif

এখানে কিছু টিপসএই অর্জন কিভাবে.

সূত্র

• বিকাশকারীর জন্য আরও 5টি সাহসী প্রশিক্ষণ প্রকল্প (লেয়ার, স্কুশ, ক্যালকুলেটর, ওয়েবসাইট ক্রলার, মিউজিক প্লেয়ার)
• 9টি প্রকল্প আপনার ফ্রন্ট-এন্ড দক্ষতা বাড়াতে
• একজন ফ্রন্ট-এন্ড ডেভেলপারের জন্য ছয়টি কাজ
• একজন বিকাশকারীর জন্য মজাদার অনুশীলন
• 8টি শিক্ষামূলক প্রকল্প
• প্র্যাকটিস করার জন্য প্রকল্পের আরেকটি তালিকা

উত্স: www.habr.com