UI прототиптерин тез арада түзүүгө жана бөлүшүүгө мүмкүндүк берген веб-тиркеме же кеңейтүү болушун каалайсызбы?
Биз баарыбыз жасайбыз! Биздин сайттарыбыз же колдонмолорубуз кандай болушун жана кандай сезимде болушун каалайбыз деген идеяларыбыз бар.
Демек, сиз чындап эле сонун дизайнды ойлоп таптыңыз жана аны кантип жасаганыңызды так эстей албай жатасызбы?
Эми аны бөлүшүүнүн жолун табышыңыз керек. Эгер сиз абдан татаал дизайнды бөлүшүүгө аракет кылып жатсаңыз, бул бир нече күн, атүгүл жумага созулушу мүмкүн.
Веб колдонмоңуздун прототиптерин жасоону күтүүгө эч кандай себеп жок. Аларды азыр Dabblet менен түзүңүз.
Элементтерди сүйрөп барып таштаңыз, стилди түзүңүз жана сактаңыз. Аны дизайнерге карап чыгууга жөнөтүңүз же жөн гана презентацияга көчүрүңүз. Мүмкүнчүлүктөр чексиз.
Dabblet деген эмне?
колдонуу менен Дабблет, сиз реалдуу убакытта CSS жана HTML кодунун кичинекей үзүндүлөрү менен эксперимент жасай аласыз.
Муну колдонууда CSS кодуңузда эч кандай префикстердин кереги жок. GitHub өзөктөрү мазмунуңузду сактоого, аны башка сайттарга жайгаштырууга жана башкалар менен бөлүшүүгө мүмкүндүк берет.
Бул код үзүндүлөрүн башка иштеп чыгуучулар менен бөлүшүүнүн жана пикир алуунун эң сонун жолу.
Ал кантип иштейт?
Код терилгенде, анын үстүнөн визуалдык чыгарылыш заматта көрүнүп турат. JavaScript жалгыз бошотуу болуп саналат, анткени аны ар бир баскыч басканда иштетүү кыжырдантат жана ал тургай белгилүү бир кырдаалдарда браузер жараксыз болуп калышына алып келиши мүмкүн.
JavaScript өтмөгүндөгү "JS иштетүү" опциясын колдонуу же баскычтоптун жарлыгын (Ctrl + Enter же Cmd + Enter) Dabblet иштегенде JavaScript иштетет. Параметрлер менюсу бул стилди өзгөртүүгө мүмкүндүк берет.
Иштеп чыгуучу катары сиз бул үч тилде тең коддоону бир убакта алмаштыра аласыз же даяр продуктту көрө аласыз.
Өзгөчөлүктөрү
Төмөндө сиз билишиңиз керек болгон Dabblet өзгөчөлүктөрү бар:
Ыкчам CSS түзөтүү: Сиз CSS касиеттерин тез кошуп, түзөтүп жана өчүрө аласыз. Өзгөртүүлөр баракта реалдуу убакыт режиминде чагылдырылат.
Синтаксисти бөлүп көрсөтүү: CSS жана HTML коду синтаксиси баса белгиленет, бул окууну жана түшүнүүнү жеңилдетет. Код сиз терген сайын текшерилет. Кааласаңыз, код кутучасын жашырууну да тандай аласыз.
Автотолуктоо: Dabblet CSS касиеттери жана баалуулуктары үчүн автотолтурууну сунуштайт. Бул стилдер жадыбалдарын түзүп же түзөтүп жатканда абдан пайдалуу болушу мүмкүн.
Алдын ала түзүлгөн CSS стилдер жадыбалдары: Сиз популярдуу веб-сайттардан алдын ала түзүлгөн CSS стилдер жадыбалдарына кире аласыз. Булар өз веб-сайтыңызга стилдерди тез жана оңой кошуу үчүн колдонулушу мүмкүн.
Негизги колдоо: Dabblet GitHub Gistsти колдойт, бул сизге код үзүндүлөрүңүздү сактоого жана башкалар менен оңой бөлүшүүгө мүмкүндүк берет.
Түз ободо алдын ала көрүү: Кодуңуздун өзгөрүшүнүн натыйжаларын баракты кайра жүктөбөй туруп эле көрө аласыз. Мисалы, сиз тексттин түсүн өзгөртсөңүз, сиз терип жатканда текстте чагылдырылган өзгөрүүнү көрөсүз.
Ыкчам баскычтар: Dabbletте жаңы стиль эрежесин кошуу же комментарий берүү сыяктуу жалпы тапшырмалар үчүн баскычтоптун жарлыктары бар.
Бир нече көрүү режимдери: Dabblet бир нече көрүү режимдерин сунуштайт, бул сизге кодду жана натыйжаларды жанаша же өйдө жана ылдый көрүүгө мүмкүндүк берет.
жакшы
- Ыкчам CSS
- Каттоо эсебине кирип турсаңыз дагы, жашыруун режимде сактай аласыз.
- бурчтар, түстөр, узактык, ж.б. сыяктуу ар кандай параметрлер үчүн Inline CSS маани алдын ала көрүүчүлөр.
- Баары XHR-ed, андыктан барак эч качан жаңыланбайт, жада калса сиз сактаганда да.
- Баскычтоптун жарлыктары көп.
- Бардык коддор автоматтык түрдө форматталган (белгилөөдөн башка).
- Башталыштан баштап катуу документтер.
жактары
- Интерфейс башында бир аз кыйын, бирок көнүп каласың.
- Долбоор деңгээлинде башкаруу функциялары жок (азырынча).
Dabblet Integrations
Ар кандай платформа башка кызматтар менен интеграцияланышы керек жана Dabblet да четте калбайт. Төмөндө Dabblet сунуш кылган интеграциялардын айрымдары бар:
Google Analytics
Google Analytics көз салуу кодуңузду Dabblet баракчаларына оңой кошо аласыз. Бул сиздин Dabblet үчүн баракты көрүүлөрдү жана башка статистиканы көзөмөлдөөгө мүмкүндүк берет.
Ubuntu
Dabblet Ubuntu темаларын түзүү үчүн колдонулушу мүмкүн. Сиз жаңы Dabblet түзүп, CSS жана HTML кодун кошуп, веб браузерде теманы алдын ала көрө аласыз.
DigitalOcean
Бир түрдөгү булут хостинг компаниясы бизнеске булуттагы эсептөө кызматтарын көрсөтөт, бул алардын ишин натыйжалуураак өстүрүүгө мүмкүндүк берет.
Dabblet аны менен эмне кылат?
Сиз азыр Dabblets түзө аласыз, башкара аласыз жана орното аласыз DigitalOcean Spaces.
Бул сизге бардык код үзүндүлөрүңүздү бир жерде сактоого мүмкүндүк берет жана аларды башкалар менен бөлүшүүнү жеңилдетет.
Dabblets үчүн альтернативалар
Альтернативалар ар дайым бар жана ошол эле мааниде, бул жерде Даблет жөнүндө ойлоно турган бир нечеси бар:
Pastebin.com
Программисттер көбүнчө веб-сайтты баштапкы кодду же конфигурация маалыматтарынын фрагменттерин сактоо үчүн колдонушат. Бирок, ар ким берилген мейкиндикке каалаган текстти коё алат.
JS Bin
JS Bin бул JavaScript үчүн акысыз тестирлөө куралы. Натыйжа бир панелде Javascript, экинчисинде HTML киргизилгенден кийин кыска URL аркылуу бөлүшүлүшү мүмкүн. Эң көп колдонулган JS китепканаларынын ичинен тандоого мүмкүндүк берген менюну колдонуңуз.
CssDeck
Бул курал коддоо аракеттериңизде сизге жардам бере турган башка адамдар менен сыноо учурларын түзүү жана алмашуу үчүн эң сонун. Ар кандай варианттардын жардамы менен сиз башка программисттер менен ошол замат долбоорлордо кызматташа аласыз.
Plunker
Plunker бул санарип платформасы, анда веб-иштеп чыгуучулар мээ чабуулуна, кызматташууга жана өз ойлорун бөлүшө алышат.
Мисалы, сиз "Салам, дүйнө!" деп баштасаңыз болот. каалаган тилде программаны түзүңүз жана бай окуу тажрыйбасын түзүү үчүн код үзүндүлөрүн, белгилерди жана скриншотторду кошуңуз.
Final Word
Жыйынтыктап айтканда, Dabblet веб-иштеп чыгуучулар үчүн пайдалуу курал, айрыкча, тез жана оңой жолдорун издегендер алардын кодун текшерүү.
Анын ар кандай өзгөчөлүктөрү жана интеграциялары менен бул платформа үчүн колдонууну табуу кыйын.
Бүгүн муну сынап көр!
Таштап Жооп