FullCodes bu — HTMLga muqobil sifatida ishlab chiqilgan soddalashtirilgan va qisqartirilgan DSL (domain-specific language) bo'lib, u HTML sintaksisini minimal, tez yoziladigan va xatolardan holi shaklga keltiradi. Dasturchilar qisqacha va toza kod yozadi, FullCodes esa uni avtomatik valid HTMLga aylantiradi.
npx fullcodes@latest
.fcode
kengaytmasi asosida fayl ochasiz. index.fcode
, main.fcode
va h.k.
Har bir afzallik HTML'dagi mavjud muammoni yechishga qaratilgan.
HTML:
<div class="box" id="main" data-info="123">Hello</div>
FullCodes:
div.box#main[data-info:123]{Hello}
Muammo: HTML'da atributlar uzun yoziladi. Har safar class="..."
va id="..."
kabi yozuvlarni takrorlash kerak.
Yechim: FullCodes’da .class
, #id
va [attr:value]
bilan yozish tez, tushunarli va takror yozishlar yo‘q.
HTML:
<div class="container">
<h1>Title</h1>
<p>Matn</p>
</div>
FullCodes:
div.container{
h1{Title}
p{Matn}
}
Muammo: HTML'da yopuvchi teglar unutilishi DOM xatolariga olib keladi.
Yechim: FullCodes’da har bir blok {}
orqali ochilib yopiladi — xatoliklar avtomatik oldi olinadi.
HTML:
<style>
.red { color: red; }
</style>
FullCodes:
style{
.red { color: red; }
}
Muammo: <style>
va <script>
yozilishi ko‘p bo‘sh joy, qavs va yangi satr talab qiladi.
Yechim: style{}
va script{}
orqali oson va toza shaklda yoziladi.
FullCodes:
html{
head{}
body{}
}
Natijasi:
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body></body>
</html>
Muammo: HTML'da meta
, viewport
, title
kiritilmasa SEO va responsive dizayn ishlamaydi.
Yechim: FullCodes avtomatik tarzda bu muhim elementlarni qo‘shadi.
HTML:
<!-- Bu sharh -->
FullCodes:
!{Bu sharh}
Muammo: <!-- -->
yozish uzoq, ko‘rinmas va xatolik xavfi bor.
Yechim: FullCodes !{}
orqali soddalashtirilgan komentariyalar taqdim etadi.
HTML:
<p>Hello <strong>World</strong> and <em>Everyone</em></p>
FullCodes:
p{Hello strong{World} and em{Everyone}}
Muammo: HTML'da taglar va matnlar chalkash aralashadi.
Yechim: FullCodes nestingni to‘g‘ri boshqaradi, matnlar ajralgan va o‘qilishi qulay.
HTML:
<input type="text" placeholder="Ism">
FullCodes:
input[type:text placeholder:Ism]/
Muammo: HTML’da yopuvchi /
unutilsa DOM buziladi.
Yechim: FullCodes .../
orqali bu muammoni hal qiladi.
HTML:
<div id="x" class="box red" data-info="1">
FullCodes:
div.red.box#x[data-info:1]{...}
Muammo: HTML’da tartib muhim va chalkashlik bo‘ladi.
Yechim: FullCodes tartibga bog‘liq emas — parser to‘g‘ri yig‘adi.
{}
Muammo: Har bir tegni aniq nomlash kerak
Yechim: FullCodes o'zi bilib div yoki html teglarini qo'yib beradi.
FullCodes:
{}
Natijasi:
<html lang="en">
Muammo: HTML'da bu atribut ko‘p hollarda unutiladi, bu esa tilni aniqlashda xatolarga olib keladi.
Yechim: FullCodes avtomatik lang="en"
qo‘shadi (keyinchalik konfiguratsiyalanishi mumkin).
{
head{
title{Sahifa nomi}
}
body{
h1{Xush kelibsiz}
p{Bu FullCodes misolidir}
input[type:text placeholder:"Ismingiz"]/
}
}
Natija (HTML):
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Sahifa nomi</title>
</head>
<body>
<h1>Xush kelibsiz</h1>
<p>Bu FullCodes misolidir</p>
<input type="text" placeholder="Ismingiz">
</body>
</html>
FullCodes — bu oddiy HTML'dan ko‘ra tezroq yoziladi, kamroq xato qiladi, va ko‘proq avtomatlashtirishni taklif etadi. Har qanday front-end yoki static-site generator jarayoniga osongina integratsiyalanishi mumkin.
npx fullcodes@latest