HTML থেকে JSX কনভার্টার
HTML পেস্ট করুন এবং পরিষ্কার React JSX পান — class হয়ে যায় className, অ্যাট্রিবিউটগুলো camelCase হয়, style স্ট্রিং অবজেক্টে পরিণত হয় এবং ট্যাগগুলো নিজে থেকে বন্ধ হয়। সম্পূর্ণ আপনার ব্রাউজারে চলে। বিনামূল্যে।
সবকিছু আপনার ব্রাউজারে চলে — আপনার মার্কআপ কখনও আপনার ডিভাইস ছেড়ে যায় না।
1
HTML থেকে JSX কনভার্টার সম্পর্কে
HTML to JSX Converter সাধারণ HTML মার্কআপকে রিয়েল-টাইমে React-প্রস্তুত JSX-এ রূপান্তর করে। এটি class-কে className এবং for-কে htmlFor-এ পুনর্লিখন করে, kebab-case ও SVG অ্যাট্রিবিউটকে camelCase করে, ইনলাইন স্টাইল স্ট্রিংকে JSX স্টাইল অবজেক্টে রূপান্তর করে, এবং img ও br-এর মতো void এলিমেন্ট নিজে থেকে বন্ধ করে দেয় — যে সম্পাদনাগুলো আপনি অন্যথায় হাতে করতেন।
একটি স্নিপেট, একটি সম্পূর্ণ পেজ সেকশন, বা ডিজাইন টুল থেকে এক্সপোর্ট করা মার্কআপ পেস্ট করুন, এবং JSX প্যানেল সিনট্যাক্স হাইলাইটিং সহ আপনি টাইপ করার সাথে সাথে আপডেট হয়। একটি ঐচ্ছিক র্যাপার আউটপুটকে একটি নামযুক্ত ফাংশন কম্পোনেন্টে পরিণত করে, ফলে আরও সম্পাদনা ছাড়াই এটি সরাসরি একটি React প্রজেক্টে বসে যায়।
কনভার্টারটি একটি সম্পূর্ণ ক্লায়েন্ট-সাইড HTML থেকে JSX টুল: আপনার মার্কআপ আপনার ব্রাউজারে JavaScript দ্বারা রূপান্তরিত হয় এবং কখনো আপনার ডিভাইস ছাড়ে না, যা এটিকে প্রোপ্রাইটরি টেমপ্লেট ও অভ্যন্তরীণ পেজের সাথে ব্যবহারের জন্য নিরাপদ করে তোলে।
HTML থেকে JSX কনভার্টার কীভাবে ব্যবহার করবেন
- বাম প্যানেলে আপনার HTML পেস্ট করুন, অথবা একটি উদাহরণ লোড করতে Sample ক্লিক করুন।
- আপনি টাইপ বা সম্পাদনা করার সাথে সাথে JSX প্যানেলটি তাৎক্ষণিক আপডেট হতে দেখুন।
- একটি প্রস্তুত ফাংশন কম্পোনেন্ট চাইলে Wrap in a component টগল করুন এবং একটি কম্পোনেন্ট নাম সেট করুন।
- JSX নিতে Copy ক্লিক করুন, বা Component.jsx হিসেবে সেভ করতে Download ক্লিক করুন।
- উভয় প্যানেল রিসেট করে আরেকটি স্নিপেট রূপান্তর করতে Clear ব্যবহার করুন।