12 Fitur Apik GitHub

Kanggo uripku, aku ora bisa mikir babagan intro, dadi ...

Kode panyuntingan #1 ing GitHub.com

Aku bakal miwiti karo apa aku kabeh wong wis ngerti (sanajan aku wong ora duwe idea babagan minggu kepungkur). Nalika ndeleng file teks ing GitHub, ing repositori apa wae, sampeyan bisa ndeleng potlot cilik ing sisih tengen ndhuwur. Yen sampeyan ngeklik, sampeyan bisa ngowahi file iki. Sawise rampung, klik Usulake pangowahan file lan GitHub bakal nggawe garpu lan Tarik Request. Apik tenan, ta? Dheweke nggawe garpu dhewe! Ora perlu garpu lan upload kode kanggo sampeyan dhewe, gawe owah-owahan lokal lan kirim maneh menyang GitHub kanthi Panjaluk Tarik. Trep banget yen sampeyan kudu nggawe suntingan minimal. ora cukup nyata Narik Request

#2 Nglebokake gambar

Katrangan masalah ora diwatesi mung komentar teks. Apa sampeyan ngerti sampeyan bisa nempel gambar langsung saka clipboard? Nalika ditempelake, sampeyan bakal weruh diunggahake (menyang awan, mesthi) lan diowahi dadi markup kanggo nampilake gambar kasebut. Anggun!

#3 Format kode

Yen sampeyan kudu nulis blok kode, miwiti nganggo telung backtick lan GitHub bakal nyoba ngira apa basa pamrograman sing sampeyan tulis. Nanging yen sampeyan ngirim potongan kode ing basa pamrograman kaya Vue, Typescript, utawa JSX, sampeyan bisa kanthi jelas nemtokake basa kasebut supaya panyorot sintaks bener. Wigati ``` jsx ing baris pisanan: ...mesthekake tampilan sing bener saka potongan kode: (Iki uga ditrapake kanggo Gist, kanthi cara. Yen sampeyan nemtokake ekstensi .jsf kanggo inti, sintaks JSF bakal disorot). Iki minangka dhaptar kabeh sintaksis sing didhukung .

# 4 Nutup masalah nggunakake "tembung ajaib" ing Panjaluk Tarik

Contone, sampeyan nggawe Panjaluk Tarik sing ndandani masalah #234. Sampeyan bisa nglebokake teks "mbenakake masalah #234" menyang katrangan panjaluk sampeyan (utawa ing ngendi wae ing komentar panyuwunan pangowahan). Sawise iki, nggabungake Panjaluk Tarik bakal "otomatis" nutup masalah kasebut. Kelangan, ta? Mangkene informasi luwih lengkap babagan iki ing dokumentasi .

# 5 Link menyang komentar

Apa sampeyan kudu nggawe link menyang komentar tartamtu lan ora ngerti carane? Dina iku wis suwe amarga aku bakal menehi rahasia: Kanggo nggawe link menyang komentar, sampeyan mung ngeklik tanggal / wektu ing jejere judhul. Deleng, gaearon saiki duwe foto!

Link kode #6

Dadi sampeyan pengin nggawe link menyang baris kode tartamtu. Ing kasus iki, coba iki: Klik ing nomer baris jejere kode sing dikarepake ing file mbukak. Wah, weruh? URL wis diganti, nomer baris saiki katon ing! Yen sampeyan terus tombol SHIFT lan klik ing nomer baris liyane, banjur voila! – URL bakal diganti maneh lan sawetara baris bakal disorot. URL iki saiki bakal nuding menyang berkas iki lan sawetara baris iki. Nanging ngenteni, iki nuduhake thread saiki. Apa yen file diganti? Sampeyan mbokmenawa mbutuhake, ing kasus iki, link permanen menyang file ing negara saiki. Aku kesed banget, mula aku njupuk gambar kabeh ing ndhuwur: Miturut cara, babagan URL ...

#7 Nggunakake URL GitHub minangka Command Line

Navigasi liwat GitHub nggunakake UI diatur kanthi trep. Nanging kadhangkala, kanggo tekan lokasi tartamtu, luwih cepet mung ngetik menyang URL. Contone, yen aku arep menyang cabang aku nggarap lan ndeleng carane mbandhingaké master, Aku mung bisa ngetik / mbandhingaké / jeneng cabang sawise jeneng gudang. Iki bakal nggawa aku menyang kaca diff kanggo cabang kasebut: Nanging iki beda karo cabang master, nanging yen aku kerja karo cabang integrasi sadurunge, aku bisa ngetik /compare/integration-branch...my-branch ing URL Kanggo penyayang hotkey: CTRL + L utawa CMD + L mindhah kursor menyang bar URL (paling ora ing browser Chrome lan Firefox). Iki, digabungake karo browser autocompletion, nggawe navigasi antarane cabang luwih gampang. Tip Pro: Gunakake panah kanggo navigasi liwat saran pelengkap otomatis Chrome, banjur pencet SHIFT+DELETE kanggo mbusak item saka riwayat (contone, sawise nggabungake cabang). (Aku ora ngerti yen bakal luwih gampang maca tombol trabasan iki yen aku sijine spasi ing wong-wong mau, kaya SHIFT + DELETE. Nanging teknis "+" ora bagean saka wong-wong mau, dadi aku ora seneng pilihan iki. Amarga kedadeyan kaya iki aku ora turu ing wayah wengi, Rhonda.)

# 8 Nggawe dhaptar kanggo masalah

Apa sampeyan pengin kothak centhang ing katrangan masalah sampeyan? Lan sampeyan pengin bar apik kaya "2 saka 5" katon nalika sampeyan ndeleng masalah saka dhaptar? Ora masalah! Sampeyan bisa nggawe kothak centhang interaktif nggunakake sintaks ing ngisor iki:

• [ ] Jembaré layar (integer)
• [x] Dhukungan buruh layanan
• [x] Njaluk dhukungan
• [ ] Dhukungan flexbox CSS
• [ ] Unsur khusus

Sintaksis: spasi, tanda hubung, spasi, tanda kurung bukak, spasi (utawa x), tanda kurung tutup, spasi lan sawetara tembung. Sawise iku, sampeyan bisa bener mriksa / mbusak centhang tombol iki! Kanggo sawetara alasan, iki misale jek kaya sawetara jenis sihir teknis kanggo kula. Sampeyan bisa obah kothak! Lan ing wektu sing padha teks asli diganti! Iku medeni kanggo mikir apa sing bakal teka karo sabanjuré. Oh, lan yen masalah iki ana ing panel proyek, banjur kemajuan bakal ditampilake ing kana: Yen sampeyan ora ngerti apa tegese "panel proyek" - maca ing ngisor iki. Mung sawetara centimeter ngisor ing kaca iki.

#9 Panel proyek ing GitHub

Kanggo proyek gedhe, aku mesthi nggunakake Jira. Lan kanggo proyek pribadi, aku mesthi nggunakake Trello. Aku seneng banget karo alat kasebut. Nalika aku sinau sawetara minggu kepungkur yen GitHub nawakake pilihan dhewe, langsung ing tab Projects ing repositori, aku mikir bakal nggawe duplikat tugas sing wis dakgarap ing Trello. Ora ana sing lucu ing kene. Lan saiki padha karo proyek GitHub: Mboko sithik mripatmu bakal digunakake kanggo gambar kontras kurang Kanggo kacepetan, aku wis nambahake kabeh kasebut ing ndhuwur minangka cathetan, tegese dudu masalah GitHub "nyata". Nanging kekuwatan manajemen masalah ing GitHub dumunung ing integrasi karo repositori liyane - mula luwih becik nambah masalah sing ana saka gudang menyang dasbor. Klik Tambah Cards ing pojok tengen ndhuwur lan golek apa sing pengin ditambahake. Iki ngendi sintaks telusuran khusus kasedhiya : contone, ketik is:pr is:open lan sampeyan bisa nyeret Panjaluk Tarik sing mbukak menyang panel, utawa label: bug yen sampeyan kudu ndandani kesalahan. Sampeyan uga bisa ngowahi cathetan sing ana dadi masalah. Lan pungkasane, saka wangun masalah sing ana, tambahake menyang proyek ing panel tengen. Bakal mlebu ing dhaptar triase panel proyek kasebut, supaya sampeyan bisa milih kolom sing arep dilebokake Nalika katrangan babagan "tugas" ana ing gudang sing padha karo kode sing ngetrapake tugas iki, trep banget (banget). Iki tegese pirang-pirang taun wiwit saiki, sampeyan bakal bisa nyalahke git ing baris kode lan ngerteni kabeh masalah sing nyebabake garis kasebut, tanpa kudu nglacak kabeh ing Jira / Trello / ing papan liya.

Cacat

Sajrone telung minggu kepungkur, aku wis nyoba nindakake kabeh ing GitHub tinimbang Jira (ing proyek cilik, gaya Kanban) lan tresna. Nanging aku ora bisa mbayangno iki kanggo proyek Scrum ing ngendi kacepetan pangembangan lan liya-liyane kudu ditaksir lan diitung kanthi bener. Kabar apik yaiku proyek GitHub duwe sawetara "fitur khusus" sing ngalih menyang sistem liyane ora butuh wektu akeh. Dadi cobanen lan deleng manawa sampeyan seneng. Aku ora ngerti carane penting iki, nanging aku krungu bab ZenHub lan mbukak kanggo pisanan 10 menit kepungkur. Iku ateges extension saka GitHub ngendi sampeyan bisa menehi rating masalah lan nggawe "epik" lan dependensi. Ana grafik saka kacepetan pembangunan lan burnout; Iku katon kaya iku mung bab apik tenan. Waca liyane: Dokumentasi GitHub ing Proyek.

#10 Gwiki

Kanggo sakumpulan kaca sing ora terstruktur—kaya Wikipedia—Wiki GitHub (sing bakal daksebut Gwiki wiwit saiki) apik banget. Kanggo sakumpulan kaca sing terstruktur - contone, kaya dokumentasi sampeyan - ora akeh. Ora ana cara kanggo nuduhake manawa "kaca iki minangka anak saka siji"; ora ana barang sing trep kaya tombol "Bagian sabanjure" lan "Bagian sadurunge". Hansel lan Gretel mesthi bakal ilang ing kene, amarga ora ana "breadcrumbs" (operator debugging khusus - kira-kira trans) ing kene. (Cathetan penulis: Apa sampeyan wis maca crita iki? Iku mung inhumane. Loro preman enom mateni wong tuwa sing luwe miskin, ngobong dheweke urip ing oven dhewe . Lan mesthi, ninggalake kekacoan lengkap kanggo ora ana sing ngerti. Aku mikir sing kok wong enom saiki dadi sensitif banget - crita sing diwaca kanggo bocah-bocah nalika turu ing dina iki ora cukup kejem!) Terusake - kanggo nyoba Gwiki kanthi nyata, aku mlebu sawetara kaca saka NodeJS minangka kaca wiki, banjur nggawe adat sidebar kanggo simulasi struktur nyata situs. Sidebar iki tansah ana, sanajan kaca saiki ora disorot. Tautan kasebut kudu dijaga kanthi manual, nanging umume kabeh bisa digunakake. Yen sampeyan pengin, sampeyan bisa ndeleng : Iki meh ora bisa saingan karo GitBook (sing digunakake ing dokumentasi Redux ) utawa situs web bespoke. Nanging iki wis 80% apik lan kabeh ana ing repositori sampeyan. Aku mung penggemar iki. Aku suggest yen sampeyan wis outgrown file README.md siji lan perlu sawetara kaca beda kanggo manual pangguna utawa dokumentasi luwih rinci, iku ndadekake pangertèn kanggo kelet karo Gwiki. Yen kekurangan struktur / pandhu arah ngganggu sampeyan, pindhah menyang liyane.

#11 Kaca GitHub

Sampeyan bisa uga wis ngerti manawa GitHub Pages bisa digunakake kanggo dadi tuan rumah situs web statis. Lan yen sampeyan ora ngerti, banjur ngerti saiki. Nanging, bagean iki darmabakti kanggo topik sing luwih spesifik: nggunakake Jekyll kanggo nggawe situs web. Ing wangun sing paling gampang, GitHub Pages + Jekyll bisa nerjemahake file README.md nggunakake tema sing katon apik. Contone, deleng kaca readme saka babagan-github : Yen sampeyan ngeklik tab setelan kanggo situs GitHub iki, aktifake GitHub Pages, banjur pilih tema Jekyll... Banjur kita bakal entuk kaca kanthi gaya tema Jekyll : Sampeyan banjur bisa nggawe situs statis kabeh adhedhasar file markup sing bisa diowahi kanthi gampang, ateges ngowahi GitHub dadi CMS. Senajan aku wis ora bener digunakake iki, iki carane website dibangun nggunakake framework Bootstrap nggunakake React, supaya ana apa-apa elek babagan. Aku nyathet yen Ruby kudu mlaku ing mesin lokal (pangguna Windows ing kene bakal ngganti pangerten lan pindhah cara liyane, pangguna macOS bakal ngomong: "Apa masalahe, sampeyan arep menyang ngendi? Ruby minangka platform universal! Ana uga GEMS sistem manajemen paket!”) (Sampeyan uga kudu dicathet yen "Konten utawa prilaku sing agresif utawa ngancam" ora diidini ing GitHub Pages, supaya sampeyan ora bisa ngirim versi crita Hansel lan Gretel ing kana).

panemuku

Sing liyane aku nyawang menyang GitHub Pages + Jekyll kombinasi (kanggo artikel iki), liyane aku panginten kabeh idea smelt aneh. Gagasan "nggawe situs web sampeyan kanthi minimal gaweyan" apik banget. Nanging kanggo nggarap sampeyan isih butuh versi saiki ing mesin lokal. Lan kanggo soko supaya "prasaja" ana akeh banget printah baris printah. Aku nyimak pitung kaca ing bagean Miwiti lan ngrasa mung siji-sijine sing gampang yaiku aku . Lan aku durung ngerti sintaks prasaja kanggo kaca utama utawa dhasar "Mekanisme Templating adhedhasar basa Cairan." Aku luwih seneng nulis situs web dhewe! Jujur, aku rada kaget yen Facebook nggunakake iki kanggo dokumentasi React nalika bisa uga nggawe kaca sistem bantuan nggunakake React lan pra-render minangka file HTML statis saben dina . Kabeh sing kudu ditindakake yaiku golek cara kanggo nampa file markup sing ana kaya-kaya asale saka CMS. Apa yen ...

#12 Nggunakake GitHub minangka CMS

Contone, kita duwe situs web kanthi sawetara teks, nanging kita ora pengin nyimpen teks kasebut minangka markup HTML. Nanging, kita pengin nyimpen potongan teks ing endi wae sing bisa gampang diowahi dening pangguna non-developer. Luwih becik karo sawetara pilihan versi. Mbok malah karo sawetara jinis proses review peer. Iki sing dakkarepake: gunakake file markup sing disimpen ing repositori kanggo nyimpen teks. Lan gunakake komponen ing sisih klien sing bakal njupuk potongan teks kasebut lan nampilake ing kaca kasebut. Aku penggemar React, dadi iki conto komponen <Markdown> sing tepat, sing diwenehi path menyang file markdown, bakal ngekstrak, ngurai, lan nggawe HTML.

class Markdown extends React.Component {
    constructor(props) {
      super(props);

      // Конечно, вам нужно заменить это на свой URL
      this.baseUrl = 'https://raw.githubusercontent.com/davidgilbertson/about-github/master/text-snippets';

      this.state = {
        markdown: '',
      };
    }

    componentDidMount() {
      fetch(`${this.baseUrl}/${this.props.url}`)
        .then(response => response.text())
        .then((markdown) => {
          this.setState({markdown});
        });
    }

    render() {
      return (
        <div dangerouslySetInnerHTML={{__html: marked(this.state.markdown)}} />
      );
    }
}

(Aku nggunakake paket sing ditandhani npm ing kene kanggo ngurai markup ing HTML) URL kasebut nuduhake repositori conto, sing ngemot file markup ing direktori /text-snippets . (Sampeyan uga bisa nggunakake API GitHub kanggo njupuk konten , nanging aku ragu yen sampeyan butuh.) Sampeyan bisa nggunakake komponen kaya iki:

const Page = () => (
  <div className="page">
    <div className="about-us">
      <Markdown url="about-us.md" />
    </div>

    <div className="disclaimer">
      <p>A very important disclaimer:</p>

      <Markdown url="disclaimers/home-page-disclaimer.md" />
    </div>
  </div>
);

Dadi saiki GitHub tumindak minangka, kanthi cara, CMS sampeyan kanggo potongan-potongan teks sing pengin di-host. Conto ing ndhuwur mung njupuk markup sawise komponen dimuat ing browser. Yen sampeyan butuh situs statis, sampeyan kudu nerjemahake ing server. Kabar apik! Ora ana sing ngalangi sampeyan njupuk kabeh file markup ing server (nggunakake strategi caching apa wae sing disenengi). Yen sampeyan mutusake menyang rute iki, gunakake nggunakake API GitHub kanggo entuk dhaptar kabeh file markup ing direktori. Bonus - utilitas GitHub! Aku wis nggunakake ekstensi Chrome Octotree kanggo sawetara wektu saiki lan nyaranake kanggo sampeyan. Ora tanpa leladen, nanging aku isih nyaranake. Nampilake panel ing sisih kiwa kanthi tampilan wit saka gudang sing sampeyan telusuri. Lan saka video iki aku sinau babagan octobox , sing uga katon minangka sarana sing apik banget nganti saiki. Iki minangka kothak mlebu kanggo masalah GitHub sampeyan. Iku kabeh sing perlu sampeyan ngerti babagan dheweke. Ngomong babagan warna, aku njupuk kabeh gambar ing ndhuwur kanthi tema sing entheng supaya ora medeni sampeyan. Nanging yen aku luwih seneng warna peteng ing kabeh liyane, mula kenapa nganggo GitHub pucat? Ing kene aku nggunakake kombinasi ekstensi Stylish kanggo browser Chrome (sing bisa ngetrapake tema ing situs web apa wae) lan gaya GitHub Dark . Lan kanggo wiwitan, alat pangembang GitHub tema peteng (dibangun, sampeyan mung kudu ngaktifake) lan tema Atom One Dark kanggo Chrome.

Bitbucket

Strictly ngandika, iku ora tanggung cocok kene, nanging aku mung ora bisa bantuan nanging sebutno Bitbucket. Rong taun kepungkur aku miwiti proyek lan ngenteni setengah dina milih hosting git paling apik. Dadi, Bitbucket menang kanthi bathi sing signifikan. Pipa kode review luwih adoh tinimbang kompetisi (wis suwe sadurunge GitHub malah duwe konsep reviewer). Wiwit kuwi, GitHub uga entuk review. Sayange, aku wis ora duwe kasempatan kanggo nggunakake Bitbucket kanggo taun pungkasan - mbok menawa padha wis dipindhah ahead ing soko maneh. Dadi aku nyaranake wong-wong sing tanggung jawab kanggo milih layanan hosting git uga menehi perhatian marang Bitbucket.

Kesimpulan

Iku kabeh! Muga-muga aku bisa ngandhani sampeyan paling ora telung perkara sing sadurunge ora dingerteni. Lan aku uga ngarep-arep supaya sampeyan bisa maca artikelku.