Så här skapar du din egen Cryptocurrency Dashboard

Med alla förhandlingar om forking Vad är en Bitcoin Fork och vad händer efteråt? Vad är en bitcoin gaffel och vad händer efteråt? Cryptocurrencies är spännande och spännande. Till skillnad från vanliga pengar kan cryptocurrency "gaffla" in i två olika typer av mynt. Men hur gör de det, och vad betyder gaffel till och med? Läs mer, bedrägerier, webbplatser som stjäl din CPU till min altcoins Är webbplatser som använder din CPU för Cryptocurrency Mining? Är webbplatser som använder din CPU för Cryptocurrency Mining? Onlineannonser är impopulära, så ökänd piratkopieringsplats Piraten Bay har slagit på en lösning: använd varje besökande dator till mina kryptokurver. Skulle du vara glad om din dator blev kapad så här? Läs mer och galen prisvolatilitet, kryptokurvor (“crypto”) blir säkert mer vanliga.

Om du har investerat eller överväger att köpa några krypteringsvalutor, behöver du ett sätt att övervaka sina priser i realtid. Lyckligtvis kan du enkelt bygga dig själv en kryptobandspelare med ingenting mer än HTML och CSS Lär dig HTML och CSS med dessa steg för steg-handledning Lär dig HTML och CSS med dessa steg för steg-handledningar Är du nyfiken på HTML, CSS och JavaScript? Om du tycker att du har en förmåga att lära dig hur man skapar webbplatser från början - här är några bra steg-för-steg-tutorials värda att försöka. Läs mer .

Notera: Inköp av kryptokurser är en mycket spekulativ investering. Investera aldrig mer än du har råd med, och var beredd att förlora allt över natten.

Komma igång

Denna instrumentbräda drivs av en gratis widget som tillhandahålls av coinmarketcap.com. Denna utmärkta webbplats visar statistik och nuvarande priser på tusentals kryptokurser. Börja med att välja din valuta, eller genom att ange ett mynt i sökfunktionen längst upp till höger.

När du väl valt, kommer du att tas till myntöversikt sida där olika statistik, diagram och analys visas om ditt valda mynt. Huvud på över till Verktyg flik. Här ser du en färdig widget, som visar specifika uppgifter om ditt valda mynt. Känn dig fri att experimentera med Anpassa den här widgeten inställningar, men för närvarande är den grundläggande widgeten tillräcklig. Kopiera koden från Webbplats Widget box eller håll sidan öppen för användning senare.

Så här ser widgetkoden ut för Bitcoin:

Oavsett om du är med i Bitcoin, Ethereum, Ripple, Dogecoin eller någon annan av 1000+ alternativ (alla) mynt finns, är denna process exakt densamma: hitta ett mynt och kopiera sedan widgetkoden.

Om du vill bli snygg med automatisering kan du använda API Ticker och ett schemaläggningsverktyg som Cron Så här schemalägger du uppdrag i Linux med Cron och Crontab Hur man schemalägger uppdrag i Linux med Cron och Crontab Möjligheten att automatisera uppgifter är en av de futuristiska tekniker som redan finns här. Varje Linux-användare kan dra nytta av schemaläggningssystem och användaruppgifter, tack vare cron, en lättanvänd bakgrundstjänst. Läs mer för att utföra nästan vad som helst du vill. Det ligger lite utanför ramen för den här artikeln, men du kan skapa en e-postmeddelande om priset sjunker under ett visst tröskelvärde, till exempel.

Bygga webbsidan

Nu när du har widgeten måste du skapa en grundläggande HTML-sida för att visa den. Använd din favorittextredigerare, skapa en ny HTML-fil som heter dashboard.html.

Här är startkoden du behöver:

Klistra in din HTML-widgetskod mellan kropp taggar. Kommer tillbaka till Bitcoin ser hela koden ut så här:

Det är allt som finns där. Det är det verkligen så enkelt för att skapa din egen Cryptocurrency dashboard.

Gör det vackert

Medan denna instrumentpanel är tekniskt klar, det är inte bra. Widgeten fyller skärmen horisontellt, men är inte så hög vertikal. Låt oss utforma det med cascading style sheets 5 Baby Steg till Learning CSS och bli en Kick-Ass CSS Sorcerer 5 Baby Steg för att lära CSS och bli en Kick-Ass CSS Sorcerer CSS är de viktigaste förändring webbsidor har sett under det senaste decenniet, och det banade vägen för separation av stil och innehåll. På det moderna sättet definierar XHTML den semantiska strukturen ... Läs mer (CSS).

Under titel, Lägg till en stil märka:

Inne i dessa stilkoder är var du ska skriva din CSS. Här är vad du behöver:

.coinmarketcap-currency-widget width: 33%; marginal: 100px auto; 

Denna enkla CSS gör två saker. Använda dokumentobjektmodellen JavaScript och webbutveckling: Använda dokumentobjektmodellen JavaScript och webbutveckling: Använda dokumentobjektmodellen Denna artikel introducerar dig i dokumentskelettet som JavaScript fungerar med. Med en fungerande kunskap om denna abstrakta dokumentobjektmodell kan du skriva JavaScript som fungerar på vilken webbsida som helst. Läs mer (DOM), det riktar sig till coinmarketcap valutor-widget klass. Denna klass är huvudbehållaren för widgeten, så det här kommandot instruerar din webbläsare att tillämpa följande stilar på det aktuella elementet.

Bredden på widgeten är inställd på 33%, vilket ser till att det inte längre ser ut sträckt när det lämnas vid standardalternativet (vilket är 100% i det här fallet).

Slutligen läggs en 100-pixel marginal till toppen och botten, med vänster och höger får du en marginal på bil. Detta flyttar widgeten bort från toppen av webbläsaren och centrerar den horisontellt.

Det finns nästan ingen gräns för hur långt du kan gå med din styling av den här widgeten. Kanske gillar du röd text eller en blå bakgrund? Vad sägs om blinkande text? Himlen är verkligen gränsen!

Lägger till fler mynt

Nu när du har naglat grunderna är det dags att lägga till fler mynt. Även om du bara äger ett mynt har olika fördelar att diversifiera din instrumentbräda.

Som en lös regel (även om allt kan hända i den vilda västern av kryptokurvor), går alla mynt upp när Bitcoin går ner, förutom när Bitcoin absolut sjunker tar det allt annat med det.

Genom att övervaka andra valutor kan du ofta tydligt se att pengar strömmar ut ur en, och till en annan. Om du vill köpa ett nytt mynt, lägger du till det i din instrumentpanel, vilket innebär att du eventuellt kan se en trend eller en daglig låg för att skaffa ett fynd!

Använd stegen ovan, och fortsätt med widgetkoden för andra valutor du vill spåra. Klistra in dem enkelt under Bitcoin-spåraren så här:

Du behöver inte currency.js för varje widget. Du behöver bara det en gång per sida.

Om du laddar om din instrumentpanel ser du det ser inte bra ut. Alla mynt är staplade vertikalt, och det finns stora gap mellan dem! Du måste ändra CSS så att dessa widgets ser bättre ut för flera mynt.

Genom att justera bredden och marginalen för varje widgetbehållare kan du ställa in flera widgets horisontellt, så här:

bredd: 23%; marginal: 10px 1%; flyta till vänster;

Med samma CSS kan du stapla upp så många widgets som du vill, även om du kanske behöver modifiera den lite efter cirka 12 widgets.

En sista avslutning är att göra instrumentpanelen automatiskt omladdad, så att du alltid har de senaste priserna.

Inuti huvud taggar högst upp i ditt dokument klistra in den här metataggen:

Detta uppdaterar din sida var X: e sekund, där X är angivet inuti innehåll. Koden ovan uppdaterar sidan var 60: e sekund. Ändra det till vad du vill, förutsatt att du anger numret i sekunder.

Bor Sane

Nu när din Cryptocurrency dashboard är klar, behöver du inte längre kontrollera coinmarketcap.com, eller coinbase.com, eller vilken webbplats du använder för att övervaka dina inköp. Bara kör inte dig galen genom att kolla priserna varje minut.

Låt det gå på din dator, eller kanske till och med ställa upp det på en Raspberry Pi och få den att springa i din korridor!

Om du vill kolla priserna på resan, ta en titt på vår guide till de bästa Android-appsna med Cryptocurrency. Håll dig uppdaterad på din CryptoCurrency Med dessa Android Apps Håll dig uppdaterad på din CryptoCurrency med dessa Android Appar Att hålla reda på virtuell valutaändring och daghandel kan både vara roliga och ett sätt att öka vinsten efter en bra dags gruvdrift. Läs mer, och glöm inte att läsa vår guide på allt du behöver veta innan du köper kryptokurrency.

Har du byggt en krypteringspanel? Var ställde du din? Låt oss veta i kommentarerna nedan!

Utforska mer om: Cryptocurrency.