• Türkiyenin ilk ve tek Web Hosting Frumuna Hoşgeldiniz, Web sitemizde Tüm üye ve ziyaretçilere açık olarak hiç bir beklenti olmaksızın Hosting, Domain, Server vb konularda Döküman paylaşımı yapmaktayız, Desteklemek ve aramıza katılmak için kayıt olmanızı tavziye ederiz :)

Cloudflare Radar 2.0'ın arkasındaki teknoloji

Slaweally

Administrator
Yönetici
Katılım
3 Eki 2022
Mesajlar
160
Tepkime puanı
25
Yaş
32
URL
alicomez.com

Bunu nasıl oluşturduk: Cloudflare Radar 2.0'ın arkasındaki teknoloji​



Bunu nasıl oluşturduk: Cloudflare Radar 2.0'ın arkasındaki teknoloji

Radar 2.0 , Radar 1.0'ın öğrendikleri üzerine inşa edildi ve geçen ay Cloudflare'nin Doğum Günü Haftası sırasında eksiksiz bir ürün yenilemesi olarak piyasaya sürüldü. Kullanıcılarımızın bilgi bulmasını ve verilerimizde gezinmesini kolaylaştırmak ve genel olarak daha iyi ve daha hızlı bir kullanıcı deneyimi sağlamak istedik.
image16.png

Bir Süper Bulut inşa ediyoruz . Cloudflare'nin ürünleri artık ağ, güvenlik, erişim kontrolleri, bilgi işlem, depolama ve daha pek çok alanda yüzlerce özellik içeriyor.
Bu blog, yeni Radarı nasıl inşa ettiğimizi mühendislik perspektifinden açıklayacaktır. Bunu, herkesin zorlu gereksinimler ve çoklu mimari katmanlar içeren biraz karmaşık bir web sitesi oluşturabileceğini, bunu yığınımızın üstünde yapabileceğini ve bunun ne kadar kolay olabileceğini göstermek için yapmak istedik.
Umarım bu, diğer geliştiricilere geleneksel yazılım mimarilerinden geçiş yapma ve uygulamalarını modern, daha verimli teknolojiler kullanarak oluşturma konusunda ilham verir.

Üst düzey mimari​

Aşağıdaki diyagram, Radar 2.0 mimarisinin kuşbakışı görünümüdür. Gördüğünüz gibi, üç ana katmana ayrılmıştır:
  • Çekirdek katmanı, veri gölümüzü, veri keşif araçlarımızı ve arka uç API'mizi tuttuğumuz yerdir.
  • Cloudflare ağ katmanı, Radar'ı barındırıp çalıştırdığımız ve genel API'lere hizmet verdiğimiz yerdir.
  • İstemci katmanı, temelde tarayıcınızda çalışan diğer her şeydir. Biz buna Radar Web uygulaması diyoruz.
image3-31.png

Gördüğünüz gibi her yerde Cloudflare ürünleri var . Kodumuzu uygun ölçekte barındırmak ve güvenli bir şekilde çalıştırmak için temel kaynakları ve aynı zamanda uygulamayı uçtan uca çalıştırmak için gerekli diğer yapı taşlarını sağlarlar.
Bu özelliklerin kullanıma hazır olması ve ekosistemimize ve araçlarımıza sıkı bir şekilde entegre edilmesiyle, bir tıklama ve birkaç kod satırı mesafesinde, mühendislik ekipleri sürekli olarak tekerleği yeniden icat etmek zorunda kalmaz ve zamanlarını esas olan şey üzerinde kullanabilirler: uygulama mantığı
Hadi kazalım.

Cloudflare Sayfaları​

Radar 2.0, geliştirici odaklı web sitesi barındırma platformumuz olan Cloudflare Pages kullanılarak dağıtılır . İlk günlerde, Sayfalarda yalnızca statik varlıkları barındırabiliyordunuz; bu, Hugo , Jekyll veya Gatsby gibi statik site oluşturucularla entegrasyon da dahil olmak üzere birçok kullanım durumu için yardımcı oldu . Yine de, uygulamanızın tek bir dağıtım kullanarak bir tür sunucu tarafı bilgi işlemine veya gelişmiş mantığa ihtiyaç duyduğu durumları çözmez.
Neyse ki Pages, kısa bir süre önce özel Workers betiklerini çalıştırmak için destek ekledi. Functions ile artık sunucu tarafı kodu çalıştırabilir ve genellikle ayrı bir Worker kullanarak uygulayacağınız her türlü dinamik işlevselliği etkinleştirebilirsiniz.
Cloudflare Sayfa İşlevleri ayrıca , tıpkı normal bir Worker'ın yaptığı gibi Dayanıklı Nesneler , KV , R2 veya D1 kullanmanıza olanak tanır . Bunun nasıl yapılacağına dair mükemmel belgeler ve Geliştirici Belgelerimizde daha fazlasını sunuyoruz. Ayrıca ekip , tüm adımları ayrıntılı olarak açıklayan tam yığın bir uygulamanın nasıl oluşturulacağına ilişkin bir blog yazdı .
Radar 2.0, iki nedenden dolayı sunucu tarafı işlevlerine ihtiyaç duyar:
  • Radar oluşturmak ve Remix'in sunucu tarafını çalıştırmak için.
  • Ön uç API'mizi uygulamak ve sunmak için.

Remix ve Sunucu Tarafı Oluşturma​

Radar 2.0'da Cloudflare Pages ile Remix kullanıyoruz.
Remix , bir sunucu/istemci modelini izler ve kullanıcının ağını kontrol edemeyeceğiniz önermesi altında çalışır, bu nedenle web uygulamalarının kablo yoluyla gönderdikleri Javascript, CSS ve JSON miktarını azaltması gerekir. Bunu yapmak için mantığın bir kısmını sunucuya taşırlar.
Bu durumda, istemci tarayıcısı, önceden oluşturulmuş DOM bileşenlerini ve kullanıcı arabirimi gereksinimlerine uygun şekilde ayarlanmış doğru miktarda JSON, Javascript ve CSS koduyla önceden getirilen API çağrılarının sonucunu alacaktır. İşte daha ayrıntılı teknik açıklama .
Tipik olarak, Remix'in tüm bunları yapmak için bir Node.js sunucusuna ihtiyacı vardır, ancak tahmin edin ne oldu: Cloudflare Workers and Pages üzerinde de çalışabilir .
Cloudflare Pages kullanarak Remix sunucusunun Workers üzerinde çalışmasını sağlayan kod:
import { createPagesFunctionHandler } from "@remix-run/cloudflare-pages";
import * as build from "@remix-run/dev/server-build";

const handleRequest = createPagesFunctionHandler({
build: {
...build,
publicPath: "/build/",
assetsBuildDirectory: "public/build",
},
mode: process.env.NODE_ENV,
getLoadContext: (context) => ({
...context.env,
CF: (context.request as any).cf as IncomingRequestCfProperties | undefined,
}),
});

const handler: ExportedHandler<Env> = {
fetch: async (req, env, ctx) => {
const r = new Request(req);
return handleRequest({
env,
params: {},
request: r,
waitUntil: ctx.waitUntil,
next: () => {
throw new Error("next() called in Worker");
},
functionPath: "",
data: undefined,
});
},
};

Remix'te rotalar , bir kullanıcı uygulamayla etkileşime girdiğinde ve onu değiştirdiğinde (örneğin, bir menü seçeneğini tıklatarak) değişiklikleri işler. Bir Remix rotasında bir loader , bir action ve bir default export olabilir. Yükleyici , veri almak için API çağrılarını işler (GET yöntemi) . Eylem , sunucuya yapılan gönderimleri (POST, PUT, PATCH, DELETE yöntemleri) işler ve yanıtı döndürür . Varsayılan dışa aktarma, React'te o rota için döndürülen UI kodunu işler. Varsayılan dışa aktarma olmayan bir rota yalnızca verileri döndürür.

Remix hem sunucuda hem de istemcide çalıştığından, akıllı hale gelebilir ve sunucu tarafında nelerin önceden getirilebileceğini ve hesaplanabileceğini ve ağ bağlantısından nelerin geçmesi gerektiğini bilerek performans ve yanıt verme için her şeyi optimize eder.
İşte Kesinti Merkezi sayfası için okunabilirlik için basitleştirilmiş bir Radar rotası örneği .
import type { MetaFunction } from "@remix-run/cloudflare";
import { useLoaderData } from "@remix-run/react";
import { type LoaderArgs } from "@remix-run/server-runtime";

export async function loader(args: LoaderArgs) {
const ssr = await initialFetch(SSR_CHARTS, args);
return { ssr, };
}

export default function Outages() {
const { ssr } = useLoaderData<typeof loader>();

return (
<Page
filters={["timerange"]}
title={
<>
<Svg use="icon-outages" />
{t("nav.main.outage-center")}
</>
}
<Grid columns={[1, 1, 1, 1]}>
<Card.Article colspan={[1, 1, 1, 1]} rowspan={[1, 1, 1, 1]}>
<Card.Section>
<Components.InternetOutagesChoropleth ssr={ssr} />
</Card.Section>
<Divider />
<Card.Section>
<Components.InternetOutagesTable ssr={ssr} />
</Card.Section>
</Card.Article>
</Grid>
</Page>
);
}

Ve işte ürettiği şey:
image18.png

Remix ve SSR, Lighthouse puanlarınız ve SEO'nuz konusunda da size yardımcı olabilir . Sunucudan tarayıcıya giden getirme ve bilgi sayısını azaltarak ve DOM'u önceden oluşturarak, Kümülatif Düzen Kayması , First Contentful Paint ve Largest Contentful Paint gibi metrikleri büyük ölçüde iyileştirebilir .
Uygulamalarını Remix'e taşıyan başka bir proje de Cloudflare TV . Değişikliklerden önce ve sonra ölçümleri böyle görünüyordu.
image12.png

Radar'ın Desktop Lighthouse puanı artık Performans, Erişilebilirlik, En İyi Uygulamalar ve SEO açısından neredeyse %100'e ulaştı.
image14.png

Radar 2.0'da yoğun olarak kullandığımız bir diğer Cloudflare ürünü ise Speed . Özellikle Erken İpuçları özelliğinden bahsetmek istiyoruz . Erken İpuçları, sunucunun, web sayfasını talep edilirken işlemek için muhtemelen hangi varlıkların gerekli olacağını tarayıcıya bildirmek için kullanabileceği yeni bir HTTP 103 başlığını tanımlayan yeni bir web standardıdır ve bu da yükleme sürelerinde önemli ölçüde iyileşme sağlar.
image2-42.png

Cloudflare Sayfalarını Erken İpuçları ile kullanabilirsiniz .

API'ler​

Radar'ın iki API'si vardır. Veri kaynaklarımıza doğrudan erişimi olan arka uç ve İnternette bulunan ön uç.

Arka uç API'sı​

Arka uç API'si Python , Pandas ve FastAPI kullanılarak yazılmıştır ve Cloudflare Access , JWT belirteçleri ve kimliği doğrulanmış bir kaynak çekme (AOP) yapılandırması ile korunmaktadır . Python'u kullanmak, ekipteki herkesin, mühendislerin veya veri bilimcilerin kolayca işbirliği yapmasına ve API'nin geliştirilmesine ve genişletilmesine katkıda bulunmasına olanak tanır ki bu harikadır. Veri bilimi ekibimiz , prototip oluşturmayı ve kodu, algoritmaları ve modelleri yeniden kullanmayı özellikle kolay ve hızlı hale getiren veri keşif iş akışlarının bir parçası olarak JupyterHub ve Jupyter Not Defterlerini kullanıyor.
Ardından, Strawberry tabanlı bir GraphQL sunucusu aracılığıyla yukarı akış ön uç API'si ile konuşur. GraphQL kullanmak karmaşık sorgular oluşturmayı kolaylaştırarak dahili kullanıcılara ve analistlere geniş veri koleksiyonumuzdan raporlar oluştururken ihtiyaç duydukları esnekliği sağlar.

Ön Uç API'sı​

Radar'ın ön uç API'sini Cloudflare Workers üzerine oluşturduk . Bu işçinin iki ana işlevi vardır:
  • GraphQL kullanarak arka uç API'sinden veri alır ve ardından dönüştürür.
  • Radar dahil herkesin kullanabileceği genel bir REST API sağlar.
Temel API'mizin önünde bir çalışan kullanmak, mikro hizmetleri kolayca ekleyip ayırmamıza olanak tanır ve ayrıca aşağıdakiler gibi dikkate değer özellikler ekler:
  • Cloudflare'nin Önbellek API'si , neyin önbelleğe alınacağı ve ne kadar süreyle önbelleğe alınacağı konusunda daha hassas kontrol sağlar ve kullandığımız POST isteklerini ve özelleştirilebilir önbellek kontrol başlıklarını destekler.
  • R2 kullanarak eski yanıtlar . Arka uç API herhangi bir nedenle bir isteği yerine getiremediğinde ve önbelleğe alınmış eski bir yanıt olduğunda, doğrudan R2'den sunulacak ve son kullanıcılara daha iyi bir deneyim sunulacaktır.
  • CSV ve JSON çıktı biçimleri. CSV formatı kullanışlıdır ve veri bilimcilerin, analistlerin ve diğerlerinin API'yi kullanmasını ve API verilerimizi doğrudan diğer araçlardan tüketmesini kolaylaştırır.

OpenAPI 3 şema oluşturucumuz ve doğrulayıcımızın açık kaynak kullanımı​

Ön uç API'sindeki son bir özellik OpenAPI 3 desteğidir. Otomatik olarak bir OpenAPI şeması oluşturur ve bununla kullanıcı girişini doğrularız. Bu, bizim de kullandığımız itty-router üzerine oluşturduğumuz özel bir kitaplık aracılığıyla yapılır . Bugün bu işi açık kaynak yapıyoruz.
itty-router-openapi , Cloudflare Çalışanları için kolay ve derli toplu bir OpenAPI 3 şema üreteci ve doğrulayıcı sağlar. Daha fazla bilgi ve nasıl kullanılacağına ilişkin ayrıntılar için GitHub depomuzu kontrol edin .

Geliştirici Belgeleri​

Bugün ayrıca , veri lisansımız, temel kavramlar, nasıl başlayacağınız ve mevcut API yöntemleri hakkında daha fazla bilgi bulabileceğiniz Radar API için geliştirici dokümantasyon sayfalarımızı da kullanıma sunuyoruz. Cloudflare Radar'ın API'si ücretsizdir ve akademisyenlerin, veri dedektiflerinin ve diğer web meraklılarının küresel ağımızdan alınan verilere dayanarak dünya genelinde İnternet kullanımını araştırmasına olanak tanır.
image6-7.png

API'mizi kullanmayı kolaylaştırmak için , oynayabileceğiniz, kopyalayabileceğiniz ve kendi kullanım durumunuza göre genişletebileceğiniz bir Colab Not Defteri şablonu da oluşturduk.
image7-4.png

Radar Uygulaması​

Radar Uygulaması, tarayıcınızda çalışan koddur. Remix hakkında konuştuk ama başka ne kullanıyoruz?
Radar, birçok veri görselleştirmesine dayanır . Grafikler ve haritalar gibi şeyler bizim için çok önemlidir. Görselleştirme bileşenlerinden oluşan yeniden kullanılabilir kitaplığımızı diğer iki çerçevenin üzerine oluşturmaya karar verdik: "React için ifade edici, düşük düzeyli görselleştirme ilkellerinin bir koleksiyonu" olan visx , DOM'u verilere dayalı olarak manipüle etmek için güçlü bir JavaScript kitaplığı olan D3 ve MapLibre , açık kaynaklı bir harita görselleştirme yığını.
İşte görselleştirme bileşenlerimizden biri iş başında. Biz buna “PewPew haritası” diyoruz.
image5-12.png

Ve işte bir sayfada ne zaman kullanmamız gerekirse, bunun için Remix React kodu:
<Card.Section
title={t("card.attacks.title")}
description={t("card.attacks.description")}
<Flex gap={spacing.medium} align="center" justify="flex-end">
<SegmentedControl
label="Sort order:"
name="attacksDirection"
value={attacksDirection}
options={[
{ label: t("common.source"), value: "ORIGIN" },
{ label: t("common.target"), value: "TARGET" },
]}
onChange={({ target }: any) => setAttacksDirection(target.value)}
/>
</Flex>

<Components.AttacksCombinedChart
ssr={ssr}
height={400}
direction={attacksDirection}
/>
</Card.Section>

SVG'ler​

Radar'da yaptığımız bir başka değişiklik de resimlerimizi ve grafik varlıklarımızı Scalable Vector Graphics'e çevirmekti . SVG'ler harikadır çünkü esasen bildirimsel bir grafik dilidirler. Vektörel bilgiler içeren XML metin dosyalarıdır. Ve böylece kolayca manipüle edilebilir, dönüştürülebilir, saklanabilir veya dizine eklenebilir ve tabii ki herhangi bir boyutta oluşturulabilir ve herhangi bir cihazda ve çözünürlükte güzel, net sonuçlar üretilebilir.
SVG'ler ayrıca bitmap formatlarına kıyasla boyut olarak son derece küçük ve verimlidir ve uluslararasılaştırmayı destekleyerek diğer dillere çevrilmelerini (yerelleştirme) kolaylaştırarak daha iyi erişilebilirlik sağlar .
İşte incelenen, SVG kodunu ve gömülü <text/> dizelerini görebileceğiniz bir Radar Balonu Grafiği örneği.
image17.png

Evren​

React Cosmos , "UI bileşenlerini ayrı ayrı geliştirmek ve test etmek için bir sanal alan" dır. Cosmos'u Radar 2.0 ile birlikte kullanmak istedik çünkü bu onun için mükemmel bir proje:
  1. Birçok görsel bileşeni vardır; bazıları karmaşıktır ve birçok yapılandırma seçeneği ve özelliğine sahiptir.
  2. Bileşenler, farklı verilerle farklı bağlamlarda birden çok sayfada yüksek oranda yeniden kullanılabilir.
  3. Multidisipliner bir ekibimiz var; herkes bir çekme isteği gönderebilir ve ön uçta kod ekleyebilir veya değiştirebilir.
Cosmos, basit düğmelerden karmaşık grafiklere kadar kullanıma hazır görselleştirmeler ve widget'lardan oluşan paletimizi görebileceğiniz ve bunların seçenekleriyle gerçek zamanlı olarak oynayıp ne olacağını görebileceğiniz bir bileşen kitaplığı görevi görür. Sadece tasarımcılar veya mühendisler değil, diğer proje paydaşları da herkes yapabilir. Bu, ekip iletişimini etkili bir şekilde geliştirir ve hızlı bir şekilde katkıda bulunmayı ve yinelemeyi sağlar.
İşte Cosmos'umuzun çalışırken çekilmiş bir ekran görüntüsü:
image1-57.png

Sürekli entegrasyon ve geliştirme​

Sürekli entegrasyon, modern yazılım yapan herhangi bir ekip için önemlidir. Cloudflare Pages, kutudan çıkar çıkmaz doğrudan yüklemeleri kullanarak CI araçlarıyla çalışmak için birden çok seçenek sunar. Ekip, GitHub Actions, CircleCI ve Travis ile bunun nasıl yapılacağına ilişkin belgeler ve örnekler hazırladı, ancak diğerlerini de kullanabilirsiniz.
Bizim durumumuzda, sürümlerimizi oluşturmak ve dağıtmak için BitBucket ve TeamCity'yi dahili olarak kullanıyoruz. İş akışımız, Radar 2.0'ı onaylı bir PR ve takip eden birleştirme üzerinde dakikalar içinde otomatik olarak oluşturur, test eder ve devreye alır.
Unit testleri Vitest ile, E2E testleri ise Playwright ile yapılmaktadır . Görsel Regresyon testi planlanmıştır ve Oyun Yazarı da bu konuda yardımcı olabilir .
Ayrıca, sürümlerimizi üretime canlı olarak geçmeden önce hazırlamak ve test etmek için birden fazla ortamımız var. CI/CD kurulumumuz, bir ortamdan diğerine geçiş yapmayı veya istenmeyen dağıtımları hızla geri almayı kolaylaştırır.
Yine Cloudflare Pages, Önizleme dağıtımları , takma adlar veya Şube oluşturma kontrollerini kullanarak bunu yapmayı kolaylaştırır . Aynı durum, Ortamları kullanan normal Çalışanlar için de geçerlidir .
image19.png

Hızlı önizlemeler ve bildirimler​

Radar 1.0, CI/CD yapmakta özellikle hızlı değildi, itiraf ediyoruz. Hızlı bir düzeltmenin, kodun işlenmesinden dağıtıma kadar yaklaşık 30 dakika sürebildiği birkaç bölüm yaşadık ve bu konuda hayal kırıklığına uğradık.
Bu nedenle, yeni CI'nin hızlı, verimli ve hızlı olmasını sağlamak için çok yatırım yaptık.
Yaptığımız harika bir şey, kod deposuna gönderilen herhangi bir taahhütte hızlı önizleme bağlantılarıydı. Derlemeler sırasında akıllı önbelleğe almanın bir kombinasyonunu kullanarak ve taahhüt normal sürüm dallarının dışındayken eşzamansız testler yaparak konuşlandırma süresini saniyelere indirmeyi başardık.
Bu, herhangi bir şubeye kod gönderildiğinde sohbetimizde aldığımız bildirimdir:
image8-2.png

Herkes sohbette belirli bir dal için bir ileti dizisini takip edebilir ve yeni değişiklikler olduğunda bildirim alabilir.
Işık hızında derlemeler, önizleme bağlantıları ve bildirimler oyunun kurallarını değiştirir. Bir mühendis, bir fikirden veya hızlı bir düzeltmeden, sonucu bir ürün yöneticisine veya başka bir ekip üyesine bir bağlantıda göstermeye geçebilir. Radar'ın tamamen çalışan uçtan uca sürümündeki değişiklikleri görmek için herkes bağlantıya hızlıca tıklayabilir.

Erişilebilirlik ve yerelleştirme​

Cloudflare, web erişilebilirliğine kendini adamıştır. Kısa bir süre önce Cloudflare Dashboard'u endüstri erişilebilirlik standartlarına uyacak şekilde nasıl yükselttiğimizi duyurduk , ancak bu öncül tüm mülklerimiz için geçerlidir. Aynısı yerelleştirme için de geçerlidir. 2020'de Dashboard'umuzu uluslararası hale getirdik ve yeni diller ve yerel ayarlar için destek ekledik.
Erişilebilirlik ve yerelleştirme el ele gider ve her ikisi de önemlidir, ancak aynı zamanda farklıdırlar. Web İçeriği Erişilebilirlik Yönergeleri , renk ve kontrast, etiketler, SVG'ler, kısayollar, hareketler ve diğerlerinin kullanımı dahil olmak üzere erişilebilirlikle ilgili birçok en iyi uygulamayı tanımlar . A11Y proje sayfası , daha fazlasını öğrenmek için mükemmel bir kaynaktır.
L10n olarak da bilinen yerelleştirme, yeni bir projeye başladığınızda daha çok teknik bir gerekliliktir. Mühendislik bağımlılıkları veya yeniden kod yazma olmadan yeni çeviriler eklemeyi kolaylaştıracak doğru kitaplık ve çerçeve setini seçtiğinizden emin olmakla ilgilidir.
Radar'ın her iki cephede de iyi performans göstermesini istedik. Tasarım sistemimiz, Cloudflare'nin tasarım ve marka yönergelerini ciddiye alır ve mümkün olduğu kadar çok A11Y iyi uygulamalarını ekler ve uygulama, sayfalarındaki ve kullanıcı arayüzü bileşenlerindeki yerelleştirme dizelerinin tamamen farkındadır.
Yeni bir dil eklemek, tek bir JSON dosyasını çevirmek kadar kolaydır. İşte en-US.json dosyasının varsayılan Amerikan İngilizcesi dizeleriyle bir parçası:
{
"abbr.asn": "Autonomous System Number",
"actions.chart.download.csv": "Download chart data in CSV",
"actions.chart.download.png": "Download chart in PNG Format",
"actions.chart.download.svg": "Download chart in SVG Format",
"actions.chart.download": "Download chart",
"actions.chart.maximize": "Maximize chart",
"actions.chart.minimize": "Minimize chart",
"actions.chart.share": "Share chart",
"actions.download.csv": "Download CSV",
"actions.download.png": "Download PNG",
"actions.download.svg": "Download SVG",
"actions.share": "Share",
"alert.beta.link": "Radar Classic",
"alert.beta.message": "Radar 2.0 is currently in Beta. You can still use {link} during the transition period.",
"card.about.cloudflare.p1": "Cloudflare, Inc. ({website} / {twitter}) is on a mission to help build a better Internet. Cloudflare's suite of products protects and accelerates any Internet application online without adding hardware, installing software, or changing a line of code. Internet properties powered by Cloudflare have all web traffic routed through its intelligent global network, which gets smarter with every request. As a result, they see significant improvement in performance and a decrease in spam and other attacks. Cloudflare was named to Entrepreneur Magazine's Top Company Cultures 2018 list and ranked among the World's Most Innovative Companies by Fast Company in 2019.",
"card.about.cloudflare.p2": "Headquartered in San Francisco, CA, Cloudflare has offices in Austin, TX, Champaign, IL, New York, NY, San Jose, CA, Seattle, WA, Washington, D.C., Toronto, Dubai, Lisbon, London, Munich, Paris, Beijing, Singapore, Sydney, and Tokyo.",
"card.about.cloudflare.title": "About Cloudflare",
...

Radar'ı yakında diğer dillerde de yayınlamamızı bekleyebilirsiniz.

Radar Raporları ve Jupyter defterleri​

Radar Raporları , belirli bir temayı derinlemesine analiz etmek için veri keşfi ve hikaye anlatımını kullanan belgelerdir. Bazı raporlar zaman zaman güncelleme alma eğilimindedir. Radar Raporlarının örnekleri, üç aylık DDoS Saldırı Trendlerimiz veya IPv6'nın benimsenmesidir .
image4-23.png

Bu Raporların kaynağı Jupyter Defterleridir . Veri Bilimi ekibimiz, dahili Jupyter Hub aracımızı kullanarak diğer paydaşlarla birlikte bazı kullanım durumları veya temalar üzerinde çalışır. Tüm yineleme ve keşifler yapıldıktan ve çalışma imzalandıktan sonra bir not defteri üretilir.
Bir Jupyter Not Defteri, metin, kaynak kodu, resimler veya çizelgeler gibi zengin medya ve diğer meta verileri içeren bir JSON belgesidir . Veri bilimi projelerini sunmak için fiili standarttır ve her veri bilimcisi bunu kullanır.
Radar 1.0 ile, bir Jupyter Not Defterini bir Radar sayfasına dönüştürmek, birçok mühendislik ve tasarım kaynağını gerektiren ve dahil olan herkes için çok fazla hayal kırıklığına neden olan uzun ve manuel bir süreçti. Yayınlanmış bir not defterini güncellemek bile çoğu zaman başımıza bela olur.
Radar 2.0 tüm bunları değiştirdi. Artık bir Jupyter Not Defteri alan ve basit kurallar ve dahili yönergeler listesi kullanılarak tasarlandığı sürece bunu otomatik olarak dönüştüren, ortaya çıkan HTML'yi ve varlıkları bir R2 klasöründe barındıran ve Raporlarda yayınlayan tam otomatik bir sürece sahibiz . sayfa.
image9-2.png

HTML'ye dönüştürme, tasarım sistemimizi ve UI bileşenlerini hesaba katar ve sonuç , genellikle uzun biçimli, Radar'ın görünümüne ve hissine mükemmel şekilde uyan güzel bir belgedir .
image13.png

Sonunda herkesin kullanabilmesi için bu aracı açık kaynak haline getireceğiz.

Daha fazla Cloudflare, endişelenecek daha az şey​

İşiniz veya mantığınızla ilgili olmayan şeyler hakkında çok fazla endişelenmeden yeni nesil uygulamanızı oluşturmak için Cloudflare'nin ürünlerini ve özelliklerini kullanmanın örneklerini verdik. Yine de birkaçı eksik.
Uygulama çalışmaya başladıktan sonra, onu kötü trafikten ve kötü niyetli aktörlerden korumalısınız. Cloudflare size bir tıklama mesafesinde DDoS , WAF ve Bot Yönetimi korumasını kutudan çıkarır çıkarmaz sunar.
Örneğin, güvenlik kurallarımızdan bazıları burada. Bu, uygulamamızda endişelenmemize gerek olmayan trafiktir çünkü Cloudflare bunu algılar ve kurallarımıza göre hareket eder.
image10-1.png

Endişelenmemize gerek olmayan başka bir şey de eski siteden yeni siteye yönlendirmeler. Cloudflare, yönlendirme listelerini doğrudan kontrol panelinde kolayca oluşturabileceğiniz Toplu Yönlendirmeler adlı bir özelliğe sahiptir .
image15.png

Gösterge Tablomuzu kullanarak neler yapabileceğinizden her bahsettiğimizde, aslında aynı şeyi Cloudflare API'lerini kullanarak da yapabileceğinizi söylediğimizi belirtmek de önemlidir . Kontrol Panelimiz tamamen bunların üzerine inşa edilmiştir. Ve kod türü bir kişi olarak altyapı iseniz, sizi de kapsıyoruz; Cloudflare Terraform sağlayıcısını kullanabilirsiniz .
Workers, R2 klasörleri veya Sayfa sitelerini dağıtmak ve yönetmek de betiklenebilirdir. Wrangler , bunu ve daha fazlasını yapmak için komut satırı aracıdır ve dağıtmadan önce bilgisayarınızda yığınımızı öykünerek tam uygulamanızı yerel olarak çalıştırmanıza izin vermek için ekstra yol kat eder.

Son sözler​

Umarız bu Radar ekibi yazısını beğenmişsinizdir ve Supercloud'umuzun üzerinde bir sonraki uygulamanızı oluşturmak için ilham almışsınızdır . Radar 2.0'ı yeni özelliklerle geliştirmeye ve yenilemeye, bulgularımızı paylaşmaya ve araçlarımızı açık kaynak kullanımına açmaya devam edeceğiz.
 
Üst Alt