Author: user

  • UnSocial and notWP

    কোডিং জার্নির এত পরে এসে ২টি node package পাব্লিশ করলাম NPM এ।

    ১। UnSocial

    ফেসবুক, ম্যাসেঞ্জার ইন্সটাগ্রামসহ বিভিন্ন অ্যাপের in-app browser আছে, সেটিংস থেকে “open in external browser” সিলেক্ট না করলে লিংক সেই ব্রাউজারেই খোলে।

    সেখানে Oauth, পেমেন্ট গেটওয়ে স্পেসিফিক বিভিন্ন কোড/redirects সহ বিভিন্ন কিছু ব্যবহার করা যায় না।

    তাই ইউজারকে “অনুগ্রহ করে external browser / chrome / safari তে ওপেন করুন” শো করা ভাল আইডিয়া।

    এজন্য আমার একটা gist আছে, সেটি থেকেই কম্পোনেন্ট বানালাম।

    TODO: Svelte, Nuxt and others component.

    ক্রেডিটঃ আমি এইরকম ব্যবহার একবারই দেখেছি। একটি ফন্ট বিক্রির সাইটে।

    ২। notWP

    যাদের ওয়েবসাইট আছে, তারা জানেন- অনেকেই /wp-admin পেজে এসে লগিন করার চেষ্টা করে। অনেক হ্যাকার দৈনিক হাজার হাজার ওয়েবসাইটের /wp-admin পেজ আছে কিনা, সেটি চেক করে বট/কোড দিয়ে।

    JS Framework দিয়ে বানানো সাইটে যখন ঐরকম ভিজিটর/বট আসে- বিরক্তই লাগে।

    সেটির সমাধান হিসেবেই notwp.

    আসলে এটি নিয়ে অনেক কাজ বাকি।

    ১। middlewire এ নির্দিষ্ট কোড যুক্ত করা – সেটির জন্য আসলে npm দরকার নেই।

    ২। ফ্রেমওয়ার্কভিত্তিক আলাদা ফাইল বানানো, টাইপস্ক্রিপ্ট সাপোর্ট সহ। এটির জন্য বেশ গবেষণা দরকার। আবার Nuxt 3 vs Nuxt 4 এর জন্য আলাদা গবেষণা দরকার। ওত সময় আসলে নেই।

    ৩। GUi বানানো, যাতে ইউজার wp-admin ফোল্ডার বানিয়ে ভিতরে import LoginPage from ‘notwp/nuxt’ বা ‘notwp/next’ ইম্পোর্ট করে ব্যবহার করলেই ফেক লগিন পেজ শো করবে, লগিন করার পর তাকে অপমান করা হবে 😀

  • Convex Login Session Issue

    Update: Fixed. Thank you @James Cowling

    ***

    On Sun, Aug 31, 3:09 PM GMT+6 (12 days ago), I emailed support@convex.com with the subject line:

    Subject: logged out
    Body:

    why every time i close my browser, I get logged out?

    my GitHub id is 2u841r, email is this (sending email)
    and zubair@ibnzamir.com

    No reply for over 10 days.

    Then on Thu, Sep 11, 12:38 AM GMT+6 (1 day ago), I replied again to that same email:

    hi, not fixed, and got no reply.

    Finally, I received a response from Graham at Convex support:

    Hi Jubair,

    Sorry for the delay, let me check with the team and see if we are having any known issues with login sessions going away too quickly.

    Graham

    My Own Fix

    Before writing this article, I tried to investigate myself.

    Turns out, the issue is related to the wos-session cookie. Its Expires / Max-age value was set to “Session”, which means it disappears when the browser is closed.

    I manually changed it to a future time — and it worked.


    Closing Thoughts

    Convex should’ve responded more quickly. Even if this was intentional (say, a security feature), a simple reply explaining it would’ve saved me a lot of frustration.

    Thanks.

  • Keyboard, Tauri, Games

    Keyboard, Tauri, Games

    এই ১৫ দিনে বেশ কয়েকটি ভিন্ন ধরণের কাজ করেছি, যা বেশ উপভোগ করেছি।

    TL-DR: Avro with GO and Rust, Learning Tauri, Making Game etc.

    ১। অভ্র

    ১.১। বড় ভাইয়ার কম্পিউটারে অভ্র কী-বোর্ড সমস্যা করছিলো। amar ৪ বার লিখছে ৪ রকম আউটপুট আসছিলো। চ্যাটজিপিটি + ম্যানুয়াল চেষ্টা করেও লাভ হয়নি।

    তাই Rust & Go দিয়ে ai দিয়ে খুবই তুচ্ছ লেভেলের অভ্র বানিয়ে দিয়েছি, তাতেও সমস্যা মেটেনি।

    ***

    ১.২। অভ্র Pascal দিয়ে বানানো। অন্য ল্যাংগুয়েজে বানাতে চাইলে কয়েকটি উপায় আছে।

    ১। অভ্র’র রিপো mugli/Avro-Keyboard তে গিয়ে রিভার্স ইঞ্জিনিয়ারিং করা।

    ২। mugli/libavrophonetic গো লাইব্রেরি ব্যবহার করা।

    ৩। omicronlab/avro-pad থেকে কোড নেয়া।

    ৪। banglatext.com এর সোর্স কোড থেকে js.download ফাইলটির কোড ব্যবহার। (অবশ্যই অনুমতি নিয়ে।)

    প্রতিটিরই সুবিধা/অসুবিধাজনক দিক আছে। সে এক অন্য আলোচনা।

    ***

    ১.৩ । আমার মত হচ্ছে- কেউ চাইলে দীর্ঘ অনেক বছর এক ল্যাঙ্গুয়েজ নিয়েই কাজ করতে পারে, ব্যস্ত থাকতে পারে। সেটি বেশিরভাগ ক্ষেত্রেই JS / php / python । কিন্তু আরো ২-৩ ল্যাঙ্গুয়েজের রানটাইম ও প্যাকেজ ম্যানেজারের নাম, খুবই ব্যাসিক Syntax এবং নিয়ম-কানুন, কোড রান ও বিল্ড করার পদ্ধতি শিখে ফেলা উচিত।

    এতে বিভিন্ন আলাদা ধরণের জিনিস নিজে করা সহজ হয়, নিজের জগতের বাহিরের অন্য অন্য জগতের মজার ও ভালো জিনিসগুলো উপভোগ করা যায়।

    রাস্টের চেয়ে গো সহজ লেগেছে + বাস্তবজগতে বেশি কাজেরও মনে হয়েছে।

    ২। Tauri

    একটানা দীর্ঘক্ষণ বসে থাকা- কিংবা আরো খারাপ- একটানা দীর্ঘক্ষণ কম্পিউটারে বসে কাজ করা তো নানারকম ক্ষতিকর। তাই Pomodoro রুল/টেকনিক ফলো করা উচিত।

    এরকমই একটি Pomodoro সফটওয়্যার হচ্ছে Stretchly। সেটি Javascript + Electron দিয়ে বানানো। সাইন ১২৮+ এমবি! ছোট্ট কাজের জন্য এত এমবির সফটওয়্যার ইন্সটল করার কোনো মানেই হয় না।

    আমি গত ১ বছরে অনেকবার Tauri এর সুনাম শুনেছিলাম। তাই Tauri-তে কোনোরকম তাড়াহুড়া + ai দিয়ে কনভার্ট করে দেখলাম- ৫৫ এমবি মাত্র!

    আর শুধু Go দিয়ে বানিয়ে সেটি মাত্র ৮ এমবি হয়েছে। GoModoro Timer

    edited: 15 Aug

    অ্যান্ড্রয়েডের জন্য apk বানাতে গিয়ে NDK, JAVA SDK ডাউনলোড করতে হলো। Windows 11 এর Developer mode চালু করতে হলো। (Android SDK আগেই ডাউনলোড করা ছিলো, যেহেতু কাস্টম রম ফ্ল্যাশ করার সময় লাগে।) তারপর tauri android build কমান্ডের পর Gradle ডাউনলোড হলো।

    ৩। গেমস

    Tauri শেখার উপায় হিসেবে Match the pairs গেম বানিয়েছি।

    এইসব বুদ্ধির খেলা বাচ্চাদের / কম বয়সীদের জন্য উপকারী হতে পারে।

    কম্পিউটারের জন্য

    ব্রাউজারে / মোবাইলে খেলার জন্য

    আরো অনেক কিছু। যেমন আজ সকালেই quran.bid লিংক রিডাইরেকশন।

  • Evolution-X

    আগামি ২৩ জুলাই আমার মোবাইলের ৩ বছর পূর্ণ হবে। Xiaomi Note 11 lite NE 5g

    পরিচিত একজনের মাধ্যমে দেশের বাহিরে থেকে আনানোর ফলে এমনিতেই ওয়ারেন্টি ছিলো না, তবুও ১ বছর/ওয়ারেন্টি ফুরানোর পরেও ৬-৭ মাস শাওমির রমই ব্যবহার করছিলাম। পরবর্তীতে ২০২৪ সালের ফেব্রুয়ারীতে PixelExperience কাস্টম রম ব্যবহার শুরু করি, ব্লগ পোস্টের লিংক – My Pixel Experience

    বিকাশ অ্যাপ ঝামেলা করছিলো। সিকিউরিটি রিজনে লগিন করতে দিচ্ছিলো না। 

    রুট তো করা না + “কাস্টম রম” ডিটেক্ট করে error দিয়েছে কিনা- জানি না, তবে এরোরে তা লেখা ছিলো না। 

    (মেইল করেছিলাম, আনইন্সটল করে আবার ইন্সটল করতে বলেছে। করলে প্রথমবার ঠিকমত লগিন হয়, পরে ২য়বার থেকেই আবার আগের সমস্যা হয়। জানিয়েছি- দেখি- কী সমাধান দেয়।)

    কাস্টম রম আরো আগেই পাল্টাতাম। কিন্তু সমস্যা হচ্ছে- পুরো মোবাইলের ব্যাকাপ রাখা, আবার প্রয়োজনীয় অ্যাপ ডাউনলোড করে লগিন করা- এগুলো কিছুটা ঝামেলার।

    যাই হোক- আমার ল্যাপটপে ২টি উইন্ডোজ দেয়া ছিলো- Windows 11 মেইন, আর Windows 10। ৬০ জিবির পার্টিশন ছিলো 10 এর জন্য – সেটি ফরম্যাট করে (কারণ স্টোরেজ deficiency তে ভুগছি, ৫০০ জিবি SSD) সেখানে ফোনের ব্যাকাপ রেখে LineageOS ফ্ল্যাশ মারতে চেয়েছিলাম।

    কিন্তু লিনেজ এর ইন্সট্রাকশনে android 14 থেকে 15 তে আপগ্রেড করতে বলছিলো, আমার তো Pixel experience এ 13 ছিলো, তাই লিনেজ বাদ দিয়ে Evolution-X এর android 14 নামিয়ে ফ্ল্যাশ মারি- বলা উচিত- ফ্ল্যাশ মারার চেষ্টা করি। 

    কিন্তু error: SPL downgrade failed- current 2024-12-05 and target spl 2024-11-01. 

    আমার মনে হয়- যেহেতু এইসব রমে গুগলের অফিশিয়াল ফিচার/প্যাচ/আপগ্রেড আসতে থাকে- তাই বিল্ড/প্যাচ ডেটও পালটে যায়। পিক্সেল এক্সপেরিএন্সে বেশ কয়েকবার আপডেট পেয়েছিলাম। 

    পরে চ্যাটজিপিকে জিজ্ঞেস করে android 15 নামিয়ে ফ্ল্যাশ মারতে গেছে ৪৭% পার্সেন্ট হওয়ার পর মোবাইলের Bootloader এ “আপনি কি শিওর আপনি ডাউনগ্রেড করতে চাচ্ছেন?” আমি Yes দিয়ে সফল হই। 

    (SPL এর ক্ষেত্রে ঐরকম কোনো অপশন দেয়নি টার্মিনালে)

    রমসিঙ্গেল কোরমাল্টি কোর
    Xiaomi Official ৭৭০২৭০৩
    PixelExperience১০২০২৭৮৯
    Evolution-X১০২৩২৯০৭

    এভাবে উন্নত হতে থাকলে ১০-১৫ বছরের মধ্যে Iphone 14, Galaxy S24 ultra কেও পিছে ফেলে দেবে 😀

    যাই হোক- আমি তো Android 13 থেকে Android 15 তেই আসলাম- সেক্ষেত্রে মনে হয় লিনেজ ট্রাই করলেও হয়ে যেত।

    লিনেজ এর ইন্সট্রাকশন খুব বেশি বিস্তারিত- নতুনদের জন্য অবশ্যই ভালো, পুরানদের জন্য বিরক্তিকর হতে পারে। তাই আমি ১০ ধাপের ইন্সট্রাকশন পড়ে দেখিনি- Evolution-X এর সংক্ষিপ্ত ইন্সট্রাকশন ফলো করে কাজ সেরে নিয়েছি।

    নোটঃ বিকাশের সমস্যা ঠিক হয়েছে, এইমাত্র ইন্সটল + আরেকবার লগিন করে দেখলাম।

  • OpenWRT and more

    ২৯ জুন দিনটা ৩-৪ কারণে অনেকদিন মনে থাকবে।

    ১। OpenWRT

    অন্যদিনের চেয়ে ফজরের একটু বেশিই আগে ঘুম ভেঙ্গে যায়, আমি ল্যাপটপে বসে যাই রাউটারে OpenWRT ফ্ল্যাশ করতে।

    OpenWRT হচ্ছে রাউটার ফার্মওয়ার/সফটওয়্যার, প্রসিদ্ধ প্রায় সব ব্র্যান্ডের জন্যই পাওয়া যায়। এটি ব্যবহার করলে বেশ কিছু আপনার রাউটারে কিছু ফিচার যোগ হতে পারে, বিভিন্ন সুবিধা বাড়তে পারে। কমপক্ষে- রাউটার কোম্পানির সফটওয়্যারের ইন্টারফেস/GUI এর চেয়ে ভিন্ন কিছু, নতুন কিছু পাবেন।

    যাই হোক ,ঘুম থেকে উঠে ২-৩টা ইউটিউব টিউটোরিয়াল দেখে ফ্ল্যাশ করতে করতে ফজরের জামাতের সময় হয়ে যায়, ১ম বার ফ্ল্যাশ করে চলে যাই।

    এসে দেখি রাউটার নষ্ট। ৩ঃ৪৫ থেকে ৮ঃ৪৫ ৫ ঘণ্টায় প্রায় ১৫ বার চেষ্টা করে সফল হয়েছি। একপর্যায়ে তো বর্তমান রাউটারকে মৃত ধরে নিয়ে নতুন কোন রাউটার কিনবো, তাও দেখা শুরু করেছিলাম!

    তারপর OpenWRT এর অফিশিয়াল ডকুমেন্টেশন পড়ে আর এআই চ্যাটে বিভিন্ন কিছু জিজ্ঞেস করে সমাধান করতে করতে সকাল পৌনে নয়টা!

    ২। দুপুরে প্রিয় একটি খাবার বাসায় রান্না হয় এবং অতীতের অনেকবারের রান্নার চেয়ে এইদিনের রান্নাটি মজা হয়েছিলো।

    ৩। আসরের আগে DeleteThing এর v1.1 গুগল ক্রোম এক্সটেনশন মার্কেটপ্লেসে অ্যাপ্রুভড হয়। সেটির README আগে ভালোভাবে লেখা ছিলো না, লিখে ফেলি।

    ডেভেলপার হেল্প সেন্টার লেখা আছে- ক্রোম এক্সটেনশন পাবলিশ করার আগে রিভিউ হতে ৩ সপ্তাহ পর্যন্ত লাগতে পারে। আমার অবশ্য প্রতিবারই ৩ দিনের কমেই হয়ে গেছে।

    ৪। রাতে আরেকটা ওয়েবসাইট ডেভেলপ করেছি, Astro এর টেমপ্লেট দিয়ে, আশা করছি সেই সাইটের ডেইলি ভিজিটরের সংখ্যা আগামী কয়েক মাসের মধ্যেই অনেক বাড়বে। আপাতত সেই সাইটের নাম এখানে লিখছি না।

    এরকম দিন আরো আসুক!

  • DeleteThing

    আমরা যখন Github, Vercel, Netlify, Cloudflare এ কোনো রিপো/প্রজেক্ট ডিলেট করতে যাই, যখন পপ-আপ/ডায়লগ আসে, যেখানে প্রজেক্টের নাম/”delete my project” ইনপুট করতে হয়, টাইপ না করলেও অন্তত কপি পেস্ট তো করতেই হয়।

    এই ঝামেলা থেকে মুক্তি পেতে ai দিয়ে এক্সটেনশন বানালাম,

    Github: https://github.com/2u841r/DeleteThing

    Download: https://dub.sh/deletething

    শুধুমাত্র ৪টি সাইটের URL ডিটেক্ট করবে + javascipt দিয়ে ডিলেট ফিল্ডে যা লিখতে হবে, তা পূরণ করে দেবে।

    গিটহাব রিপো ডিলেট করতে ডিলেট বাটনে ক্লিক, তারপর ২ টি ক্লিক + ইনপুট + আরেক ক্লিক করতে হয় (৫ ধাপ)- এই এক্সটেনশন দিয়ে ২ ধাপ

    গুগল ক্রোম মার্কেটপ্লেসে পাবলিশও করেছি, $5 খরচ করে এক্সটেনশন মার্কেটপ্লেসে অ্যাকাউন্ট খুলতে হয়েছে।

    উপকৃত হলে গিটহাবে স্টার এবং ক্রোম মার্কেটপ্লেসে রেটিং দেয়ার জন্য রইলো।

    নিরাপদ কিনা?

    ১। গুগল এক্সটেনশন পাবলিশের সময় + প্রতিবার আপডেট করলে রিভিউ করে।

    ২। সোর্স কোড দেখতেই পাবেন

  • DNS

    আমি ২৭ মে এবং পরবর্তি কিছুদিনে অনেক ঘণ্টা DNS নিয়ে গবেষণা করেছি।

    তার আগে, যদি না জেনে থাকেন- DNS (Domain Name System) হলো ইন্টারনেটের ফোনবই।

    এটি ওয়েবসাইটের নাম (যেমন: google.com) কে আইপি অ্যাড্রেসে (যেমন: 142.250.196.14) রূপান্তর করে, যাতে কম্পিউটার বুঝতে পারে কোন সার্ভারে যেতে হবে।

    সংক্ষেপে: DNS ওয়েবসাইটের নামকে আইপি ঠিকানায় বদলে দেয়।

    ডিএনএস চেক করতে https://dnscheck.tools

    Windows 11 এ Chrome ব্রাউজারে ডিএনএস সেট করতে সমস্যা হলে https://www.stefanvd.net/project/chrome-policy-remover/

    প্রসিদ্ধ কয়েকটি DNS সার্ভিস

    Google 8.8.8.8
    Cloudflare 1.1.1.1
    OpenDNS 208.67.222.222
    Quad9 9.9.9.9
    NextDNS 45.90.28.0
    AdGuard 94.140.14.14
    DNS.SB 185.222.222.222
    KahfGuard 40.120.32.170

    বেশিরভাগেরই ড্যাশবোর্ড নেই, অর্থাৎ আপনি দেখতে পারবেন না যে- আপনি ইন্টারনেট ব্যবহার করার সময় সারাদিনে/সারামাসে আপনার মোবাইল/ডিভাইস থেকে মোট কয় হাজার রিকোয়েস্ট গিয়েছে, কয় হাজার ব্লক হয়েছে।
    শুধুমাত্র NextDNS এবং AdGuard DNS এর ড্যাশবোর্ড আছে, তাও বেশ উন্নতমানের! (আগামি ২৭ জুন আমার ড্যাশবোর্ডের স্ক্রিনশট এই পোস্টে বা সামনে দেয়া গিটহাব রিপোতে যুক্ত করবো ইনশাল্লাহ)।

    কোন DNS ভালো? স্পিড বেশি ও নিরাপদ?

    এই লিংকে https://github.com/2u841r/dns-compare গিয়ে Windows অংশের কোড কপি করে আপনার কম্পিউটারের Powershell এ পেস্ট করুন, রেজাল্ট আসবে। কয়েকবার টেস্ট করুন।

    আমি যতবার টেস্ট করেছি, কাহাফগার্ড শেষের ২ এ ছিলো। (কাহাফগার্ড সম্পর্কে সামনে আসছে)।

    গুগল DNS এর চেয়ে Cloudflare অনেক ভালো পেয়েছি।

    Quad9-ও বেশ প্রসিদ্ধ, প্রাইভেসি ফোকাসড, সুইজারল্যান্ডভিত্তিক। DNS.SB চিনতাম না, সেটাও ভালো পারফর্ম করছিলো। ওয়েবসাইট ভিজিট করে ওদের সম্পর্কে অনেক কিছুই জেনেছি, ওরা জার্মানভিত্তিক।

    KahfGuard

    কাহাফগার্ড ডিএনএস হোস্ট করা মাইক্রোসফটের Azure UK সার্ভারে।

    উপরের বাক্যতে দুইটা সমস্যা আছে, কী কী বলেন তো?

    ১। Azure কেন?

    গুগলে সার্চ দিন- noazureforapartheid অথবা ভিডিট করুন https://noazureforapartheid.com/

    ব্লগঃ https://medium.com/@notechforapartheid

    ২। UK কেন? Singapore বা Mumbai না কেন?

    (Kahf এর কেউ কেউ এক সময় UK-তে থাকতো/এখনো আছে হয়ত, তাই অভ্যাস অনুযায়ী করে ফেলেছে ।)

    বা বাংলাদেশেই কোনো রিলায়াবল সার্ভারেও হতে পারতো। (যেহেতু GCP & AWS এর বিরুদ্ধেও অভিযোগ আছে)।

    I know, বাংলাদেশ আর রিলায়াবল হয়ত পাশাপাশি যায় না, সেক্ষেত্রে অন্তত এক ভার্সন বা সেকেন্ডারি DNS বাংলাদেশী হতে পারতো। (Strong Protection, Moderate Protection, Weak Protection এর মত ৪র্থ একটা- BD server)

  • My Tech Stack

    Published: 1-Oct-2024, Last Updated: 08-June-2025

    tldr: Next, Nuxt, Sveltekit, Astro, Tailwindcss, Supabase, D1, Drizzle, Convex, AWS, Full-Stack Cloudflare.

    Frontend: React, Next, Svelte, Vue, Astro, Gatsby

    রিয়্যাক্ট তো সবাই শেখেই, পাশাপাশি আমি Svelte শিখেছি এবং বেশ মজা পেয়েছি। আমার এই ওয়েবসাইটও বর্তমানে Svelte দিয়েই করা, আগে Gatsby-তে ছিলো (গিটহাবে MIT license) – আরেকটি ভালো জিনিস।

    আর Vue এর ক্র্যাশ কোর্স দেখে Svelte এর সাথে অনেক মিল পেয়েছি, কাজ চালিয়ে নিতে পারবো বলে মনে করি। (December, 2025 এ Mastering Nuxt 3 কোর্সটি করেছি।) Update: May 2025 – Nuxt.com এর রিপোতে ২টি PR মার্জ হয়েছে, যা আমাকে একজন ছোট Nuxter বানিয়ে দিয়েছে 🙂

    (উভয়টিই syntax.fm এর CJ Raynold এর Vue-Nuxt এর কোর্স, একটা তো প্রায় ১২ ঘণ্টার! সেটি দেখে নাক্সটের অনেক কিছুই শেখা হয়ে গেছে।)

    ২০২৫ এর জানুয়ারীতে Astro শেখার পর মনে হলো- আরো আগে কেন শিখলাম না। Gatsby + Graphql এ বেশ কষ্টে যা করা হতো, তা খুবই সহজে করে ফেলা যায়। Gatsby-র ১ জিবির প্রজেক্ট Astro তে ৫০০ এমবি!

    October 2024 : Fresh (Deno) & HonoX এর Docs পড়েছি।

    Tanstack, Solid নিয়েও ঘাটাঘাটি করার ইচ্ছা আছে।

    আমার শেখার ধারাবাহিকতাঃ React, Gatsby, Svelte, Vue, Next, Nuxt, Astro

    Language: JS+TS (primary), তবে অক্টোবরে python, django – Netninja (uk) ইউটিউব চ্যানেল থেকে, php, laravel ক্র‍্যাশ কোর্স + w3schools থেকে শিখেছি- বলা উচিত- এক্সপ্লোর করেছি। নভেম্বরের ৬-৭ তারিখে Bek Brace চ্যানেলের ৩ ঘন্টার Rust Crash course দেখেছি। তাতে মনে হয়েছে- টাইপস্ক্রিপ্ট + লারাভেল = রাস্ট 🦀😃। এগুলো এমনেই এক্সপ্লোর, ২০২৫ এ জাভাস্ক্রিপ্ট+টাইপস্ক্রিপ্টের বাহিরে যাওয়ার ইচ্ছা নেই।

    জুন ২০২৫ঃ Go এর বেশ কিছু বিষয় শিখেছি।

    Styling: CSS, SASS, Tailwind

    টেইলউইন্ড সবার পরে শিখেছি। ভবিষ্যতে UnoCSS ব্যবহার করার ইচ্ছা আছে। Anthony Fu আমার কোডিং লাইফের হিরো/আইডল।

    Backend: Express, Hono, CF Workers, Swagger, OpenAPI Specification

    Hono বেশ ভালো লাগে। সবকিছু সংক্ষেপে + typescript (Cloudflare & Deno উভয়েই অফিশিয়ালি Hono-কে প্রমোট করে)।

    DB: Convex, MongoDB, PostgreSQL & Others

    শুরুতে MongoDB বেশি ব্যবহার করতে করতে SQL শেখা হচ্ছিলো না, পরে Supabase এবং Cloudflare D1 দিয়ে SQL এর বাস্তব ব্যবহার শেখা। Simpack প্রজেক্টে Supabase SQL ব্যবহার করা হয়েছে।

    মে ২০২৫ঃ Convex হচ্ছে ভবিষ্যতের, বরং বর্তমানেরও সেরা ডাটাবেজ + ব্যাকেন্ড সলিউশন। প্রচুর ভালো লেগেছে। t3.chat + Theo এবং Web Dev Cody-ও এটির ভক্ত। ওদের থেকেই আমি কনভেক্সের সন্ধান পেয়েছি।

    ORM: Prisma & Drizzle

    Headless CMS: Strapi, WP

    Cloud: AWS, Cloudflare, Supabase, Deno Deploy, OVH

    ‘সেলফ হোস্ট’ আমার ভালো লাগে। মে ২০২৪ থেকেই AWS ব্যবহার করছি।

    Coolify, HestiaCP, Uptime Kuma, Algo VPN, Squid Proxy, NextCloud সহ অনেক কিছুই হোস্ট করেছি।

    Deploy: Netlify, Vercel, Amplify, Cloudflare Pages, EC2

    Deno Deploy ব্যবহার করতে গিয়ে Deno এর বেশ কিছু ব্যবহার শিখতে হয়েছে, যা NPM & BUN থেকে আলাদা।

    Git: Github, Gitlab, Bitbucket, AWS Codecommit, SourceHut

    গিটহাবই তো উইনার, গিটল্যাবের ফ্রিতে/প্রো মেম্বারশিপ কেনা ছাড়া কোলাবোরেশনের ব্যাপারটা ভালো। শেষ ৩টি একবার একবার ব্যবহার করে পরিচিতি হয়েছি।

    SourceHut এর সন্ধান পেয়েছিলাম https://timharek.no/ থেকে, এবং উনার ব্লগে দেখেই PGP Key, Email Encryption / Kleopatra শিখে উনার পাব্লিক কী দিয়ে এনক্রিপ্ট করে ইমেইল করে ধন্যবাদ দিয়েছিলাম।

    CI / CD: জীবনে অনেক করেছি- এমন না। তবে Deno Deploy তে Sveltekit SSR এর জন্য করেছিলাম, আরেকবার আরেক প্রজেক্টে করেছিলাম। বেশ মজার জিনিস।

    আরো যা শিখবো (ইনশাল্লাহ)- আমি AWS যে ইউটিউব চ্যানেল থেকে শিখেছি- Gaurav Sharma, সেখানে Terrraform, Kubernetes, Ansible, Jenkins, Shellscript এর টিউটোরিয়াল আছে, সেগুলোও ২০২৫ শেষ হওয়ার আগেই শিখে ফেলার ইচ্ছা আছে।

    Open Source Contribution: Full Stack Army এর ৩৫+ ভিডিওর টাইমস্ট্যাম্প বানিয়েছি। এছাড়া Sveltepress (Vitepress এর svelte ভার্সন) এর ডকুমেন্টেশন এর বাংলা অনুবাদ করেছি।

    কোডিং জার্নির আরো অনেক আগে www.time.is সাইটের অনুবাদ করেছিলাম।

    আমার লাইভ প্রজেক্ট:

    বিঃ দ্রঃ প্রজেক্টের সোর্স কোড, কেস স্টাডি নেভিগেশন বারের /projects এ পাওয়া যাবে।

    সর্বশেষ কাজটি হচ্ছে- অনলাইনে ক্লাস করানোর জন্য একটি প্রজেক্ট, যেটিতে ভর্তি, হাজিরা, এককালীন/মাসিক পেমেন্ট ও রেকর্ডেড ক্লাসের লিংক ছাত্রদের জন্য অ্যাড করা যায়। পুরোপুরি SaaS না, একই প্রজেক্টের রিপো দুটি ডোমেইনে দুজনকে দিয়েছি।

    তার আগের প্রজেক্ট একটি কোর্সের সাইট, ওপেন সোর্স না।

    আলকাউসার (ফ্যানমেইড) – Gatsby + Tailwind দিয়ে বানানো।

    ৩টি আলাদা ফ্রেমওয়ার্কে এই সাইট – মূলটি গিটহাব থেকে Fork করেছি, পরে Gatsby থেকে Svelte এ কনভার্ট করেছি, মূল Author কে দেখিয়েছিও। ভবিষ্যতে css থেকে Tailwind এ কনভার্ট করার ইচ্ছা আছে। এখন ৭০% আমার কোড, তখন ১০০% আমার কোড হয়ে যাবে।

    আমার ভাইয়ের জন্য বানানো ডিসকর্ড বট, যা EC2 তে রান করা আছে।

    ২টি VS Code এর থিম।

  • Not Awesome Next.js

    গত বছর চ্যাটপিজিটি তাদের ওয়েবসাইট Next.js থেকে রিমিক্সে মাইগ্রেট করে। তারপর থেকেই বিভিন্ন বড় বড় ব্যক্তিদের থেকে বিভিন্ন ভিডিও, আর্টিকেল ও টুইট দেখেছি- প্রত্যেকেই “Next.js কেনো ভালো না / Next.js থেকে সরে এসে ভালো করেছি” টাইপের লেখা লিখেছিলো।

    সে পর্যন্ত তাও ভালো / কম খারাপ ছিলো। কিন্তু গত সপ্তাহের nextjs middleweare vulnerability দেখার পর থেকে মন আরো উঠে গেছে। (ভার্সেল অবশ্য বেশ দ্রুতই ফিক্স করেছে।)

    এমন না যে- অন্য ফ্রেমওয়ার্ক (nuxt, astro) বা টুলে (vite) কোনোদিন কোনো vulnerability ছিলো না- কিন্তু Next.js এর এটি আসলেই অনেক বড়।

    এখানে আমি বেশ কিছু লিংক দিয়ে রাখি, যা ভবিষ্যতে আমার ও অন্যদের কাজে লাগবে।

    ১। You should know this before choosing Next.js by Eduardo Bouças, Netlify

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

    ২। Why I Won’t Use Next.js by Kent C. Dodds (epicweb.dev)।

    এটির অবশ্য ‘জবাব’ আছে, যার লিংক ব্লগের শেষে দেয়াও আছে- https://archive.leerob.io/blog/using-nextjs

    ৩। Remix vs Next.js official Remix blog

    ৪। How we run nextjs – Netlify blog

    এমনিতেও Astro বেশ ভালো করছে, React Router 7 / Remix যথেষ্ট অ্যাটেনশন পেয়েছে এবং পাচ্ছে। আমি গত জানুয়ারী/ফেব্রুয়ারীতে রিমিক্সের একটি ক্র্যাশ কোর্স দেখেছিলাম, এখন তো মনে হচ্ছে- খুব ভালোভাবেই শিখে ফেলবো।

    আরেকটা কথা- ২০+ ফ্রেমওয়ার্কের হোমপেজ ভিজিট করে আমার কাছে রিমিক্সের হোমপেজটাই সেরা লেগেছে- https://remix.run/

    8-sept-2025

    https://blog.meca.sh/3lxoty3shjc2z

  • Course Website

    এই পুরো ফেব্রুয়ারী জুড়ে আমি একটি কোর্সের ওয়েবসাইট নিয়ে কাজ করেছি। 

    পুরো কাজটা করেছি- আমার ওয়েবসাইটে ১০জন সেলেব্রেটি শিক্ষকের কোর্স আছে, দৈনিক কয়েক হাজার ভিজিটর / অনেক হাজার পেজ ভিউ হবে – এটা ভেবে। নইলে ১-২টা কোর্স, মোট ১০০ বা কয়েকশো স্টুডেন্ট – ধরে নিয়ে কাজ অনেক কম সময়ে হয়ে যেতো।  

    টেক স্ট্যাক

    Nextjs, Tailwindcss, Coolify, Self hosted Supabase, Google Oauth, 

    Nextjs আসলেই বিভিন্ন কারণে ‘কম ভালো’। আমি Remix/React Router 7 এর অনেক সুনাম (আর nextjs এর দুর্নাম) দেখেছি টুইটারে, অচিরেই রিমিক্স/RR7 ট্রাই করার ইচ্ছা আছে। 

    আর Nuxt 3 তো অফিশিয়াল Mastering Nuxt 3 টিউটোরিয়াল থেকে শিখেছিলাম, সেটার বিভিন্ন ভালো দিক আছে, যেমন- ইমপোর্টের জন্য ৮-১০ লাইন খরচ না করা। 

    Tailwindcss আসলেই ভালো।

    আর Supabase নিঃসন্দেহে ডেভেলপার এক্সপেরিয়েন্স অনেক ভাল করে দিয়েছে, ভেন্ডর লক করা ছাড়া (আসলেই কি?)। Firebase, Cloudflare, Vercel-ও করেছে, খুব শক্তভাবে ভেন্ডর লক করে। 

    ফোল্ডার স্ট্র্যাকচার

    / হোমপেজে Hero Section, ২টি কোর্সের বর্ণনা + লিংক, Faq, Features ইত্যাদি।

    /course প্রটেকটেড রাউট, লগিন করা থাকতে হবে।

    /course/[courseName] এ গেলে ঐ কোর্সের ল্যান্ডিং / মার্কেটিং পেজ আর এনরোল বাটন। (কোর্স না কিনে থাকলে)

    /course/[courseName]/enroll এ গেলে ফর্ম, পেমেন্ট ডিটেইল

    /course/[courseName]/pending কেনার পর অ্যাডমিন ভ্যারিফাই করা পর্যন্ত কোর্স অ্যাক্সেস করার চেষ্টা করলে এই পেজে আসবে।

    /course/[courseName] কোর্স কেনা থাকলে এই পেজে চ্যাপ্টারগুলোর টাইটেল দেখাবে, ধরা যাক ৮ চ্যাপ্টারের নাম দেখাচ্ছে।

    /course/[courseName]/[chapter]/এই পেজে গেলে যেই চ্যাপ্টারে ক্লিক করেছে- সেটার ভিডিওগুলোর তালিকা, ধরার যাক প্রথম চ্যাপ্টারে ১০টি ভিডিও আছে।

    /course/[courseName]/[chapter]/[topic] এই পেজে ভিডিও প্লেয়ার

    Third Party Services

    mux – ভিডিও হোস্ট।

    resend – ট্রাঞ্জেকশনাল ইমেইলের জন্য।

    uploadthing – পেমেন্ট করার সময় ট্রাঞ্জেকশন আইডি না দিয়ে MFS অ্যাপ বা ম্যাসেজের স্ক্রিনশট আপলোডের জন্য। (ঐচ্ছিক)

    sentry – বাগ ফিক্স + সেশন রিপ্লে

    খরচ কম + স্পিড বেশি

    আমার শুরু থেকেই টার্গেট ছিলো- 

    ১। হোস্টিং/ডাটাবেজ ইত্যাদির জন্য Vercel+ Supabase-কে টাকা দেবো না।

    ১। BDIX স্পীড যেন থাকে, যেহেতু ভিজিটর সবাই বাংলাদেশরই হবে।

    টাকা না দেয়ার ব্যাপারটা- উভয়টার মিনিমাম প্রো-টায়ারে Vercel $25 + Supabase Pro $25 + Minimum Compute (1 vcpu 2 gb ram) $9.99 = $59.99 ডলার মাস (আরো অনেক কাহিনী), অনেক বেশি। বছরে প্রায় লক্ষ টাকা।  

    নিজে ম্যানেজ করলে 2 vcpu 4 GB ram ৬০ ডলারে (অফারে ভিপিএস কিনতে পারলে) সারা বছর হয়ে যাবে। এর দ্বিগুণ বা ৪ গুণ শক্তিশালী ভিপিএস নিলেও ঐ খরচের তুলনায় কিছুই না। 

    এবার আরেকটু বিস্তারিত বলি। কেন ভার্সেল নয়? 

    ভার্সেলে ফ্রি টায়ারে ১ মিলিয়ন Edge Requests লিমিট, Nextjs/SSR/Sveltekit ইত্যাদির প্রথম ভিজিটে ৫০-৭০ Edge Requests  লাগে, তারপরের পেজগুলোতে ১০-২০ রিকোয়েস্ট। 

    ১ মিলিয়নে ২০ হাজার পেজ ভিউ হয়ত হবে (৫০ রিকোয়েস্ট প্রতি পেজ হিসেবে) – খুব কম না, তবুও, তারপর তো পেইড প্ল্যানে যেতে হবে। 

    আমার Vercel Usage (অনেকগুলো হবি/প্র্যাকটিস প্রজেক্ট)

    Edge Requests                59K/1M

    Function Invocations         15K/100K

    Edge Middleware Invocations  7.4K/1M

    তারমানে আমার ক্ষেত্রে (এবং অনেকের ক্ষেত্রেই হয়ত) যত এজ রিকোয়েস্ট খরচ হয় তার ৪ ভাগের ১ভাগ Function Invocations এবং ৮ ভাগের ১ ভাগ Edge Middleware Invocations। 

    আর সুপাবেস- এদের প্রাইসিং এর আগামাথা বোঝা কঠিন। যা বুঝেছি- 

    আপনার ফ্রি অ্যাকাউন্টে ২টা প্রোজেক্ট দেবে, ৫১২ র‍্যাম আর shared cpu (NANO) 

    আপনি যদি ১ জিবি বা আরো বেশি র‍্যাম + নন-শেয়ার্ড/ডেডিকেটেড সিপিইউ চান- তাহলে ২৫ ডলার দিয়ে প্রো প্ল্যান কিনতে হবে, তারপর কম্পিউটের জন্য আলাদা করে ফি। 

    এই Self Hosted এর সিদ্ধান্ত আমার সময় ব্যয় + মাথাব্যথা ৩ গুণ বাড়িয়ে দেয়। (তবুও খুশি, অনেক কিছু শেখা হয়েছে)

    2  vCPU 4 GB ram BDIX VPS কেনা ছিলো, সেটাতে ৫+ Self Hosted app রান ছিলো। 

    সেটাতেই Coolify সেটাপ করে সেখানে আমার কোর্সসাইট+Supabase ডিপ্লয় করি। 

    এই পর্যন্তও ঠিক ছিলো। 

    Google Oauth 

    Supabase এ GUI দিয়ে খুব সুন্দরভাবে Oauth সেটাপ করা যায়, যদিও ফ্রি প্ল্যানে কাস্টম ডোমেইন সেট করা যায় না। আপনার ওয়েবসাইট যদি হয় abcd.com, গুগল দিয়ে লগিন করার সময় দেখাবে আপনি etrogjhfletwpytz.supabase.co তে লগিন করার চেষ্টা করছেন। খুবই বিরক্তিকর। 

    ***

    টাকা যেহেতু খরচ করবো না- তাই এবার আমাকেই VPS > data/coolify/services/Supabase/ docker-compose.yml এ নিচের লাইনগুলো অ্যাড করতে হয়

          GOTRUE_EXTERNAL_GOOGLE_ENABLED: true

          GOTRUE_EXTERNAL_GOOGLE_CLIENT_ID: ****.apps.googleusercontent.com

          GOTRUE_EXTERNAL_GOOGLE_SECRET: GOCSPX-z–*************Vt

          GOTRUE_EXTERNAL_GOOGLE_REDIRECT_URI: https://supabasekong.my-coolify-domain.tld/auth/v1/callback

    github/supabase/auth আপনাকে এতটুকুই বলবে। কিন্তু আরো ব্যাপার আছে। 

    কুলিফাই-সুপাবেসে GOTRUE_SITE_URL: ‘${SERVICE_FQDN_SUPABASEKONG}’ থাকে ডিফল্টে, Coolify GUI থেকে পাল্টানো যায় না, disabled হয়ে থাকে। 

    docker-compose.yml এ গিয়ে পাল্টাতে হয়- GOTRUE_SITE_URL: ‘https://my-course-website.com’

    আর ADDITIONAL_REDIRECT_URLS: ‘http://localhost:3000,’https://my-course-website.com’

    এই ভ্যালুগুলো হয়ত কারো কারো কাছে জঞ্জাল- আমার কাছে খুবই গুরুত্বপূর্ণ। 

    ***

    আরো কাজ বাকি আছে। 

    গুগল অথ ব্যবহার করলে- নিজের লোগো আপলোড করলে (গুগলে লগিনের সময় আপনার অ্যাপের নাম + লোগো দেখাবে) and/or ১০০+ ইউজার হয়ে গেলে ভ্যারিফিকেশনের জন্য সাবমিট করতে হয়। (এছাড়াও প্রতি বছর অ্যানুয়াল রিভিউ এর একটা ব্যাপার আছে।) 

    গুগল অথের অনেক স্ট্যান্ডার্ড আছে- ওয়েবসাইটের ব্র্যান্ডিং, হোমপেজে কী কী উল্লেখ থাকতে হবে, Terms & Condition, Privacy Policy কিভাবে কী থাকতে হবে, ইত্যাদি। ওগুলো এখনো করা হয়নি।