From b1e2c8fd5cb5dfa46bc440a12eafaf56cd844b1c Mon Sep 17 00:00:00 2001
From: Philipp Tanlak <philipp.tanlak@gmail.com>
Date: Mon, 24 Nov 2025 20:54:57 +0100
Subject: Docs

---
 content/_index.html | 196 ++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 196 insertions(+)
 create mode 100644 content/_index.html

(limited to 'content/_index.html')

diff --git a/content/_index.html b/content/_index.html
new file mode 100644
index 0000000..eafb0c1
--- /dev/null
+++ b/content/_index.html
@@ -0,0 +1,196 @@
+---
+title: Build customer scrapers in minutes
+layout: hextra-home
+images:
+  - images/ogimage.png
+---
+
+<div class="max-w-2xl mx-auto text-center">
+  <h1 class="my-8 text-[3rem] lg:text-[4rem] leading-tight font-bold mx-auto">
+    Custom scrapers <br />
+    built in minutes.
+  </h1>
+
+  <p class="my-16 text-xl leading-relaxed text-gray-700 dark:text-gray-300">
+  Flyscrape is a modern toolkit for building custom scrapers in minutes.<br /> It can render
+  JavaScript, use cookies of your browser and requires no Node.js or Python to run.
+  </p>
+
+  <div class="text-center flex flex-col md:block">
+    <a href="/docs/getting-started"
+      class="inline-block px-8 py-3 md:mr-5 mb-5 md:mb-0 text-lg font-semibold text-center text-white transition-all duration-200 ease-in bg-black border-black border-2 rounded-full cursor-pointer focus:outline-none focus:ring-4 focus:ring-primary-300 dark:bg-white dark:text-black dark:border-white dark:focus:ring-primary-800">Get
+      Started <span style="position:relative;margin-left: 2px;top: -1px">{{< icon name="chevron-right">}}</span></a>
+    <!-- <a href="/proxy" -->
+    <!--    class="inline-block px-8 py-3 text-lg font-semibold text-center text-black transition-all duration-200 ease-in rounded-full cursor-pointer border-2 border-black focus:outline-none focus:ring-4 focus:ring-primary-300 dark:text-white dark:border-white dark:focus:ring-primary-800">Need Proxies?</a> -->
+  </div>
+</div>
+
+<div class="w-full max-w-4xl mx-auto my-16 p-4 rounded-md" style="background-image: url('/images/videobg.jpg'); background-size: cover;">
+  <!--<p class="mb-4 text-center text-gray-600 dark:text-gray-400">Click the video below to see it in action.</p>
+<a href="https://www.youtube.com/watch?v=Yj11v4n9JHA" target="_blank">
+<img src="/images/flyscrape-demo.jpg" class="rounded-lg" style="display: block" />
+</a>
+-->
+  <iframe src="https://www.youtube.com/embed/eGk8qFZ9oM4?si=D5j2vssfkPnvVKZy" title="YouTube video player"
+    frameborder="0"
+    allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
+    style="width: 100%; aspect-ratio: 16 / 9;" allowfullscreen class="rounded-md"></iframe>
+</div>
+
+<button class="mx-auto inline-block" onclick="document.getElementById('scrollto').scrollIntoView({behavior: 'smooth'})">
+Discover the Features
+<br />
+<span class="text-xl"> {{< icon name="arrow-down">}} </span>
+</button>
+
+<div id="scrollto"></div>
+<hr class="hidden w-full my-8 dark:block lg:my-12"
+  style="border-color: hsl(var(--primary-hue) var(--primary-saturation) 94% / 0.2);" />
+<hr id="features" class="w-full my-8 dark:hidden lg:my-12"
+  style="border-color: hsl(var(--primary-hue) var(--primary-saturation) 94% / 0.8);" />
+
+<div class="w-full mt-12 text-center lg:text-left">
+  <div class="gap-12 flex flex-col lg:grid lg:grid-cols-2">
+
+    <div>
+      <h2 class="py-2 mt-12 mb-8 text-4xl font-bold leading-none tracking-tighter text-black not-prose dark:text-white">
+        Easy-peasy Setup.
+      </h2>
+      <p class="text-xl text-gray-800 dark:text-gray-300 sm:text-xl">
+        Flyscrape is a standalone scraping tool and does not need Node.js or Python.
+        Simply run <code
+          class="px-2 py-1 text-sm text-black border border-gray-500 rounded-md dark:text-white whitespace-nowrap">flyscrape new</code>
+        and you're ready to scrape.
+        <br />
+        <br />
+        <a href="/docs/getting-started"
+          style=" display: inline-block; color: hsl(var(--primary-hue) var(--primary-saturation) 45% / var(--tw-text-opacity));    text-decoration-line: underline; text-decoration-thickness: from-font; text-underline-position: from-font;">Visit
+          the Getting Started Guide</a>
+      </p>
+    </div>
+
+    <img src="/images/flyscrapenew.gif" class="block rounded-lg order-last lg:order-none w-full mx-auto" loading="lazy" style="max-width: 570px" />
+  </div>
+
+  <hr class="hidden dark:block my-24"
+    style="border-color: hsl(var(--primary-hue) var(--primary-saturation) 94% / 0.2);" />
+  <hr class="w-full dark:hidden my-24"
+    style="border-color: hsl(var(--primary-hue) var(--primary-saturation) 94% / 0.8);" />
+
+  <div class="gap-12 flex flex-col lg:grid lg:grid-cols-2">
+    <img src="/images/flyscrapebrowser.gif" class="block rounded-lg order-last lg:order-none w-full mx-auto" loading="lazy"  style="max-width: 570px"/>
+
+    <div>
+      <h2 class="py-2 mt-12 mb-8 text-4xl font-bold leading-none tracking-tighter text-black not-prose dark:text-white">
+        Browser / JS rendering.
+      </h2>
+      <p class="text-xl text-gray-800 dark:text-gray-300 sm:text-xl">
+        Browser Mode can help you scrape even the most difficult sites. Whether the site heavily relies on JavaScript or has Anti-Bot measures, it's always worth a shot.
+        <br />
+        <br />
+        <a href="/docs/configuration/browser-mode"
+          style=" display: inline-block; color: hsl(var(--primary-hue) var(--primary-saturation) 45% / var(--tw-text-opacity));    text-decoration-line: underline; text-decoration-thickness: from-font; text-underline-position: from-font;">Visit
+          the Browser Mode Documentation</a>
+      </p>
+    </div>
+
+  </div>
+
+  <hr class="hidden dark:block my-24"
+    style="border-color: hsl(var(--primary-hue) var(--primary-saturation) 94% / 0.2);" />
+  <hr class="w-full dark:hidden my-24"
+    style="border-color: hsl(var(--primary-hue) var(--primary-saturation) 94% / 0.8);" />
+
+  <div class="gap-12 flex flex-col lg:grid lg:grid-cols-2">
+
+    <div>
+      <h2 class="py-2 mt-12 mb-8 text-4xl font-bold leading-none tracking-tighter text-black not-prose dark:text-white">
+        Access your Cookies.
+      </h2>
+      <p class="text-xl text-gray-800 dark:text-gray-300 sm:text-xl">
+        Give Flyscrape access to the cookie store of your personal browser. This makes scraping protected websites, that require an active login session easy as cake.
+        <br />
+        <br />
+        <a href="/docs/configuration/cookies"
+          style=" display: inline-block; color: hsl(var(--primary-hue) var(--primary-saturation) 45% / var(--tw-text-opacity));    text-decoration-line: underline; text-decoration-thickness: from-font; text-underline-position: from-font;">Visit
+          the Cookie Documentation</a>
+      </p>
+    </div>
+
+    <img src="/images/flyscrapecookies.gif" class="block rounded-lg order-last lg:order-none w-full mx-auto" loading="lazy" style="max-width: 570px" />
+  </div>
+
+  <hr class="hidden dark:block my-24"
+    style="border-color: hsl(var(--primary-hue) var(--primary-saturation) 94% / 0.2);" />
+  <hr class="w-full dark:hidden my-24"
+    style="border-color: hsl(var(--primary-hue) var(--primary-saturation) 94% / 0.8);" />
+
+  <div class="gap-12 flex flex-col lg:grid lg:grid-cols-2">
+    <img src="/images/flyscraperequestcontrol.gif" class="block rounded-lg order-last lg:order-none w-full mx-auto" loading="lazy"  style="max-width: 570px"/>
+
+    <div>
+      <h2 class="py-2 mt-12 mb-8 text-4xl font-bold leading-none tracking-tighter text-black not-prose dark:text-white">
+        Precise Request Control.
+      </h2>
+      <p class="text-xl text-gray-800 dark:text-gray-300 sm:text-xl">
+        Precisely control how fast requests are processed, what links to follow or what sites to avoid.
+        8 different dials allow you to fine-tune Flyscrape's behaviour for virtually every website.
+        <br />
+        <br />
+        <a href="/docs/configuration"
+          style=" display: inline-block; color: hsl(var(--primary-hue) var(--primary-saturation) 45% / var(--tw-text-opacity));    text-decoration-line: underline; text-decoration-thickness: from-font; text-underline-position: from-font;">Browse all Configuration Options</a>
+      </p>
+    </div>
+
+  </div>
+
+  <hr class="hidden dark:block my-24"
+    style="border-color: hsl(var(--primary-hue) var(--primary-saturation) 94% / 0.2);" />
+  <hr class="w-full dark:hidden my-24"
+    style="border-color: hsl(var(--primary-hue) var(--primary-saturation) 94% / 0.8);" />
+
+  <div class="gap-12 flex flex-col lg:grid lg:grid-cols-2">
+
+    <div>
+      <h2 class="py-2 mt-12 mb-8 text-4xl font-bold leading-none tracking-tighter text-black not-prose dark:text-white">
+        Extract exactly what you need.
+      </h2>
+      <p class="text-xl text-gray-800 dark:text-gray-300 sm:text-xl">
+        Flyscrape comes with the full power of JavaScript, allowing you to precisely define what you want to scrape from a website. 
+        With its familiar jQuery- or cheerio-like API selecting HTML elements becomes second nature.
+        <br />
+        <br />
+        <a href="/docs/api-reference"
+          style=" display: inline-block; color: hsl(var(--primary-hue) var(--primary-saturation) 45% / var(--tw-text-opacity));    text-decoration-line: underline; text-decoration-thickness: from-font; text-underline-position: from-font;">Visit
+          the API Reference</a>
+      </p>
+    </div>
+
+    <img src="/images/flyscrapequery.jpg" class="block rounded-lg order-last lg:order-none w-full mx-auto" loading="lazy" style="max-width: 570px"/>
+  </div>
+
+  <hr class="hidden dark:block my-24"
+    style="border-color: hsl(var(--primary-hue) var(--primary-saturation) 94% / 0.2);" />
+  <hr class="w-full dark:hidden my-24"
+    style="border-color: hsl(var(--primary-hue) var(--primary-saturation) 94% / 0.8);" />
+
+
+  <h2
+    class="py-2 mx-auto mt-12 mb-8 text-4xl font-bold leading-none tracking-tighter text-black  not-prose dark:text-white text-center">
+    Want to give Flyscrape a try?
+  </h2>
+  <p class="mx-auto text-xl text-gray-800 dark:text-gray-300 sm:text-xl text-center">
+    Dive into our user-friendly guide and discover how to get started with ease.
+  </p>
+
+</div>
+<div class="mx-auto my-12 text-lg ">
+
+
+  <a href="/docs/getting-started"
+    class="inline-block px-8 py-3 text-lg font-semibold text-center text-white transition-all duration-200 ease-in bg-black rounded-full cursor-pointer focus:outline-none focus:ring-4 focus:ring-primary-300 dark:bg-white dark:text-black dark:focus:ring-primary-800">Get
+    Started <span style="position:relative;margin-left: 2px;top: -1px">{{< icon name="chevron-right">}}</span></a>
+
+</div>
+
+<script async src="https://app.flyscrape.com/script.js?v=0"></script>
-- 
cgit v1.2.3