မှောင်မိုက်နောက်ခံ VKontakte အောင်လုပ်နည်း

မဟုတ်အမြဲတမ်းပရိုဂရမ်မာသူကုဒ်တွေနဲ့အလုပ်လုပ်သောမှတဆင့်လက်အထူးဆော့ဗ်ဝဲမှာဖြစ်ပါတယ်။ ဒါသင် code နဲ့သက်ဆိုင်တဲ့ဆော့ဖ်ဝဲကိုတည်းဖြတ်ရန်လိုအပ်ကြောင်းဖြစ်ပျက်လက်မှာမဟုတျပါဘူးဆိုရင်အခမဲ့အွန်လိုင်းဝန်ဆောင်မှုကိုသုံးနိုင်သည်။ Next ကိုကျနော်တို့ဒီဆိုက်များနှစ်ခုအားဆွေးနွေးရန်နှင့်သူတို့ထဲမှာအသေးစိတ်စစ်ဆင်ရေး၏နိယာမခွဲခြမ်းစိတ်ဖြာပါလိမ့်မယ်။

အွန်လိုင်း Edit ကိုကုဒ်

ထိုကဲ့သို့သောအဖြစ်, ထိုအရပ်၌များစွာသောအယ်ဒီတာများဖြစ်ကြပြီးသူတို့အားလုံးကိုဖွင့်မမြင်မိပါဘူး, ငါတို့လူကြိုက်အများဆုံးဖြစ်ကြောင်းနှင့်လိုအပ်သော tools များ၏အခြေခံသတ်မှတ်ချက်ဖြစ်ကြောင်းနှစ်ခုသာအွန်လိုင်းအရင်းအမြစ်များကိုအာရုံစိုက်ဖို့ဆုံးဖြတ်လိုက်ကြပြီ။

ကိုလည်းကြည့်ပါ: တစ်ဂျာဗားပရိုဂရမ်တစ်ခုရေးဖို့ဘယ်လို

Method ကို 1: CodePen

အဆိုပါ site ကို CodePen အများအပြား developer များ, မိမိတို့ကိုယ်ပိုင် codes တွေကိုဝေမျှကိုဆက်လက်ထိန်းသိမ်းရန်နှင့်စီမံကိန်းများနှင့်အတူအလုပ်လုပ်ကြသည်။ အဲဒီမှာသင့်ရဲ့အကောင့်ကိုဖန်တီးချက်ချင်းရေးသားခြင်းကိုစတင်ရှုပ်ထွေးချည်းနှီးဖြစ်၏, အောက်ပါအတိုင်းအဖြစ်ဤအမှုကိုပြုသောသည်:

ဝက်ဘ်ဆိုက် CodePen ကိုသွားပါ

  1. အပေါ်ကလင့်ခ် သုံး. home page ကို CodePen site ကိုဖွင့်ပါနှင့်အသစ်တခုပရိုဖိုင်းကိုဖန်တီးရန်ဆက်လက်ဆောင်ရွက်နိုင်သည်။
  2. ညွှန်ကြားချက်မှတ်ပုံတင်ပြီးအတိုင်းလိုက်နာရန်အဆင်ပြေလမ်းကိုရွေးချယ်ပါ, သင့်ရဲ့ကိုယ်ပိုင်အကောင့်ဖန်တီးပါ။
  3. သူတို့ရဲ့စာမျက်နှာပေါ်တွင်အချက်အလက်များကိုဖြည့်စွက်။
  4. ယခုတွင်သင်သည် pop-up menu ကိုချဲ့ထွင်ခြင်း, tab ကိုတက်နိုင်ပါတယ် "Create" နှင့်ကို select "စီမံကိန်း".
  5. ညာဘက်ပြတင်းပေါက်၌သင်တို့ကိုထောက်ခံဖိုင် Format နဲ့ပရိုဂရမ်းမင်းဘာသာစကားများကိုမြင်ရပါလိမ့်မယ်။
  6. ယင်းတင်းပလိတ်များထဲကတစ်ခုသို့မဟုတ် Standard markup HTML5 ကိုရွေးချယ်ခြင်းဖြင့်တည်းဖြတ်ရေးစတင်ဖို့။
  7. လက်ဝဲအားလုံး created စာကြည့်တိုက်နဲ့ဖိုင်တွေပြပေးလိမ့်မယ်။
  8. လက်ဝဲ mouse ကိုညာဘက် code ကိုဖော်ပြပေးအပေါ်ပြတင်းပေါက်၌သက်ဝင်စေဖို့အရာဝတ္ထုပေါ်ကလစ်နှိပ်ပါ။
  9. အောက်ခြေတွင်သင်သည်သင်၏ကိုယ်ပိုင်ဖိုင်တွဲတွေနဲ့ဖိုင်တွေကိုထည့်သွင်းဖို့ခွင့်ပြုခလုတ်ရှိပါတယ်။
  10. စီမံကိန်းတီးပွီး, နာမည်တစ်ခုသတ်မှတ်နှင့်ပြောင်းလဲမှုများကို save လုပ်ပါ။
  11. မည်သည့်အချိန်တွင်သငျသညျအပျေါ LMB နှိပ်ခြင်းအားဖြင့်စီမံကိန်းဆက်တင်များသို့သွားနိုင်ပါတယ် "Settings" ကို.
  12. ခေါင်းစဉ်, ဖော်ပြချက်, tags များနှင့် preview ကိုဆက်တင်နှင့်ကုဒ်ထစ် - ကဒီမှာကအခြေခံသတင်းအချက်အလက်နှင့်ထိတွေ့သည်။
  13. သငျသညျအလုပျဧရိယာ၏လက်ရှိအမြင်နှင့်အတူစိတ်ကျေနပ်မှုမရပါက, သင်ရရှိနိုင်အပေါ်နှိပ်ခြင်းအားဖြင့်ပြောင်းလဲ "ပြောင်းလဲခြင်းကြည့်ရန်" နှင့်တပ်မက်လိုချင်သောအ viewport ကိုရွေးပါ။
  14. သင် code ကတန်းစီတည်းဖြတ်တဲ့အခါ, အပေါ်ကိုကလစ်နှိပ်ပါ "ကြော်ငြာကို Save လုပ်ရန်အားလုံး + Run ကို"ပြောင်းလဲမှုများကို save နှင့်ပရိုဂရမ်ကို run ရန်။ အောက်ခြေမှာပြုစု output ကိုဖော်ပြပေးမှာဖြစ်ပါတယ်။
  15. ယင်းအပေါ်ကိုနှိပ်ခြင်းအားဖြင့်သင့်ကွန်ပျူတာပေါ်ရှိစီမံကိန်း Save "ပို့ကုန်".
  16. အပြောင်းအလဲနဲ့ပြည့်စုံသည်အထိစောင့်ဆိုင်းနှင့်ဖိုင်ကို upload လုပ်။
  17. အသုံးပြုသူတစ်ဦးတက်ကြွစီမံကိန်းကိုထက်ပိုရှိသည်မဟုတ်နိုင်ပါတယ်ကတည်းကအသစ်ကိုသင်တဦးတည်းဖန်တီးချင်တယ်ဆိုရင်ကအခမဲ့ဗားရှင်း CodePen ဖယ်ရှားပစ်ရန်လိုအပ်ပါလိမ့်မည်။ ဒီလိုလုပ်ဖို့ပေါ်တွင်ကလစ်နှိပ်ပါ "ကိုဖျက်".
  18. အတည်ပြုစကားလုံး Enter နှင့်ဖျက်မှုကိုအတည်ပြုပါ။

ကျွန်တော်အထက်တွင်အွန်လိုင်းဝန်ဆောင်မှု CodePen အခြေခံလုပ်ဆောင်ချက်များကိုထည့်သွင်းစဉ်းစားပါပြီ။ သငျသညျမွငျနိုငျအဖြစ်က code ကိုတည်းဖြတ်ရန်မသာ, ဒါပေမယ့်လည်းခြစ်ရာကနေရေး, ပြီးတော့အခြားအသုံးပြုသူများနှင့်အတူမျှဝေဖို့ကောင်းစွာသင့်လျော်သည်။ ဆိုက်၏တစ်ခုတည်းသောအားနည်းချက်အခမဲ့ဗားရှင်းအတွက်ကန့်သတ်ထားပါသည်။

Method ကို 2: LiveWeave

ယခုငါ LiveWeave ကို web အရင်းအမြစ်မှာနေဖို့လိုပါတယ်။ ဒါဟာ built-in ကုဒ်အယ်ဒီတာ, ဒါပေမယ့်လည်းငါတို့အောက်တွင်ဖော်ပြထားသောဆွေးနွေးရန်သောအခြားကိရိယာများ, မသာပစ္စုပ္ပန်ဖြစ်ပါတယ်။ အောက်မှာဖေါ်ပြတဲ့အတိုင်းဒါဟာဆိုက်နှင့်စတင်သည်:

ဝက်ဘ်ဆိုက်ကိုသွားပါ LiveWeave

  1. စာမကျြနှာအယ်ဒီတာဖို့အထက်ပါ link ကိုလိုက်နာပါ။ ဒီနေရာမှာချက်ချင်းသငျသညျလေးပြတင်းပေါက်မြင်လိမ့်မည်။ ပထမဦးဆုံးဒုတိယ၌, HTML5 ကိုနိုင်တဲ့ coding ထဲမှာရာအရပ်ကိုကြာ - တတိယအတွက် JavaScript ကို - CSS ကို, စတုတ္ထအတွက်စုစည်းရလဒ်ပြသထားတယ်။
  2. ဒီ site ရဲ့ features တွေကိုတ tag ကိုစာရိုက်တဲ့အခါမှာသူတို့ကစာရိုက်မြန်နှုန်းတိုးမြှင့်ခြင်းနှင့်စာလုံးပေါင်းအတွက်အမှားအယွင်းများရှောငျနိုငျ Tooltip အဖြစ်ထည့်သွင်းစဉ်းစားစေနိုင်ပါသည်။
  3. ပုံမှန်အားဖြင့်, ထိုစုစည်းချက်ချင်းပြောင်းလဲမှုပြီးနောက်လုပ်ငန်းများ၌, သောကွောငျ့ဖွစျသညျ, တိုက်ရိုက်ထုတ်လွှ-mode မှာတွေ့ကြုံတတ်၏။
  4. သင်ဤ function ကိုပိတ်ထားချင်တယ်ဆိုရင်, သင်လိုချင်သောပစ္စည်းကိုဆနျ့ကငျြဘပု slider ကိုရွှေ့ဖို့လိုအပ်ပါတယ်။
  5. ညဥ့် mode ကိုပေါ်နဲ့ off Next ကိုမရရှိနိုင်အလှည့်။
  6. သင့်အနေဖြင့်လက်ဝဲ panel ကိုအပေါ်သင့်လျော်တဲ့ခလုတ်ကိုနှိပ်ခြင်းဖြင့် CSS ကို Controller ကိုနှင့်အတူအလုပ်လုပ်ရန်သွားနိုင်ပါတယ်။
  7. မီနူးခေါင်းစဉ်ထဲမှာလျှောရွေ့လျားခြင်းဖြင့် edited နှင့်အချို့သောတန်ဖိုးများကိုပြုပြင်မွမ်းမံသည်။
  8. နောက်ထပ်ကျနော်တို့ကအရောင်ပစ်မှတ်တွေကိုအာရုံစိုက်ဖို့အထူးအကြံပြုလိုတယ်။
  9. သင်မည်သည့်အရောင်ကိုရွေးချယ်နိုင်သောနေရာအဖြစ်ကျယ်ပြန့် palette ပေးသဖြင့်, interface နဲ့အစီအစဉ်များကိုရေးသားသည့်အခါနောက်ပိုင်းတွင်အသုံးပြုသည်သောကုဒ်၏ထိပ်မှာပြသပါလိမ့်မယ်။
  10. menu ကိုရွှေ့ရန် "Vector Editor ကို".
  11. ဒါဟာတခါတရံကဆော့ဖ်ဝဲဖွံ့ဖြိုးတိုးတက်မှုစဉ်အတွင်းအသုံးဝင်သောဖြစ်လိမ့်မည်ဟုသော graphical တ္ထုနှင့်အတူအလုပ်ထုတ်ဆောင်သွားကြ၏။
  12. pop-up menu ကိုဖွင့်ပါ "Tools"။ ရရှိနိုင်မယ့် template ကိုတင်က HTML-file နဲ့စာသားမီးစက်ချွေတာလျက်ရှိ၏။
  13. တစ်ခုတည်းဖိုင်ထဲမှာစီမံကိန်းဒေါင်းလုဒ်လုပ်ခြင်း။
  14. သင်သည်သင်၏အလုပ်စောင့်ရှောက်ရန်လိုလျှင်, Pre-မှတ်ပုံတင်ရေးအွန်လိုင်းဝန်ဆောင်မှုအတွက်လုပ်ထုံးလုပ်နည်းခံယူရပါလိမ့်မယ်။

ယခုတွင်သင်သည် LiveWeave site ပေါ်တွင် code ကိုတည်းဖြတ်ဖို့ဘယ်လိုသိကြ၏။ ကျနော်တို့လုံခြုံစွာက program ကိုကုဒ်တွေနဲ့အလုပ်လုပ်များ၏ဖြစ်စဉ်ကိုပိုကောင်းအောင်နှင့်ရိုးရှင်းဖို့ features နဲ့ tools တွေအများကြီးရှိပါတယ်ဘာဖြစ်လို့လဲဆိုတော့ဒီအွန်လိုင်းအရင်းအမြစ်သုံးစွဲဖို့အကြံပြုနိုင်ပါတယ်။

ဒါဟာကျွန်တော်တို့ရဲ့ဆောင်းပါးပြီးစီးခဲ့သည်အဆုံးသတ်ခဲ့သည်။ ယနေ့ကြှနျုပျတို့အွန်လိုင်းဝန်ဆောင်မှုများကိုသုံးပြီးကုဒ်တွေနဲ့အလုပ်လုပ်ပုံကိုအပေါ်နှစ်ခုအသေးစိတ်ညွှန်ကြားချက်ရန်သင့်အားမိတ်ဆက်ပေးသည်။ ကျနော်တို့ကဒီသတင်းအချက်အလက်အသုံးဝင်သောကြီးနှင့်အလုပ်အကိုင်အများအတွက်အသင့်လျော်ဆုံး Web ကိုသယံဇာတရွေးချယ်ဖို့ကကူညီပေးခဲ့မျှော်လင့်ပါတယ်။

ကိုလည်းကြည့်ပါ:
တစ်ဦးပရိုဂရမ်းမင်းပတ်ဝန်းကျင်ရွေးချယ်ခြင်း
အန်းဒရွိုက် applications များကိုဖန်တီးရန်အစီအစဉ်ကို
ဂိမ်းကိုဖန်တီးရန် program တစ်ခုရွေးချယ်ခြင်း