From 4d1a5ed61ac3a4f51426058b241ce1f1379b7f9e Mon Sep 17 00:00:00 2001 From: Felix Wotschofsky Date: Sun, 8 Dec 2024 20:14:49 +0100 Subject: [PATCH] =?UTF-8?q?Rework=20landing=20pages=20=F0=9F=8F=A0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../_components/sponsors-section.tsx | 69 +++++++++---- app/(landing)/_components/trust-section.tsx | 16 +++ .../_components/trusted-by-logos.tsx | 2 +- .../_components/trusted-by-section.tsx | 34 ------- app/(landing)/certs/page.tsx | 94 +++++++++--------- app/(landing)/map/page.tsx | 99 ++++++++++--------- app/(landing)/page.tsx | 44 +++++---- app/(landing)/subdomains/page.tsx | 97 +++++++++--------- app/(landing)/whois/page.tsx | 93 +++++++++-------- app/_components/feedback-prompt.tsx | 6 +- 10 files changed, 302 insertions(+), 252 deletions(-) create mode 100644 app/(landing)/_components/trust-section.tsx delete mode 100644 app/(landing)/_components/trusted-by-section.tsx diff --git a/app/(landing)/_components/sponsors-section.tsx b/app/(landing)/_components/sponsors-section.tsx index 7c11b06..4e8c0f7 100644 --- a/app/(landing)/_components/sponsors-section.tsx +++ b/app/(landing)/_components/sponsors-section.tsx @@ -1,6 +1,14 @@ import Image from 'next/image'; import { type FC, type HTMLAttributes } from 'react'; +import { + Dialog, + DialogContent, + DialogHeader, + DialogTitle, + DialogTrigger, +} from '@/components/ui/dialog'; + import { env } from '@/env'; import { getGitHubSponsors } from '@/lib/github'; import { cn } from '@/lib/utils'; @@ -38,7 +46,7 @@ export const SponsorsSection: FC = async ({ className={cn(className, 'flex flex-col items-center gap-4')} {...props} > -

Sponsored by

+

Sponsored by

{allSponsors.map((sponsor) => ( @@ -57,23 +65,48 @@ export const SponsorsSection: FC = async ({ ))}
- - - Sponsor through GitHub and add your logo - {' '} - or{' '} - - reach out for more options - - + + + Add your logo + + + + Sponsor Domain Digger + +

+ Sponsorships are a great way to support the project and help with + further development. As a thank you, your logo with a link to your + site will be displayed on all landing pages and on the project's + README. +
+
+ Sponsorships are available through{' '} + + GitHub Sponsors + {' '} + and{' '} + + Buy Me a Coffee + + , or{' '} + + reach out for more options + +

+
+
); }; diff --git a/app/(landing)/_components/trust-section.tsx b/app/(landing)/_components/trust-section.tsx new file mode 100644 index 0000000..d82b263 --- /dev/null +++ b/app/(landing)/_components/trust-section.tsx @@ -0,0 +1,16 @@ +import type { FC, HTMLAttributes } from 'react'; + +import { TrustedByLogos } from './trusted-by-logos'; + +type TrustSectionProps = HTMLAttributes & { + subpage?: string; +}; + +export const TrustSection: FC = (props) => ( +
+
+

Trusted by experts at

+ +
+
+); diff --git a/app/(landing)/_components/trusted-by-logos.tsx b/app/(landing)/_components/trusted-by-logos.tsx index 50018ae..9cbc83d 100644 --- a/app/(landing)/_components/trusted-by-logos.tsx +++ b/app/(landing)/_components/trusted-by-logos.tsx @@ -11,7 +11,7 @@ const formatHref = (domain: string, subpage?: string) => { }; export const TrustedByLogos: FC = ({ subpage }) => ( -
+
Cloudflare & { - subpage?: string; -}; - -export const TrustedBySection: FC = (props) => ( -
-
- -); diff --git a/app/(landing)/certs/page.tsx b/app/(landing)/certs/page.tsx index c4231d6..5259186 100644 --- a/app/(landing)/certs/page.tsx +++ b/app/(landing)/certs/page.tsx @@ -1,9 +1,9 @@ import type { FC } from 'react'; import { SearchForm } from '../../_components/search-form'; +import { AuthorSection } from '../_components/author-section'; import { SponsorsSection } from '../_components/sponsors-section'; -import { AuthorSection } from './../_components/author-section'; -import { TrustedBySection } from './../_components/trusted-by-section'; +import { TrustSection } from '../_components/trust-section'; export const revalidate = 86400; // 24 hours @@ -16,51 +16,57 @@ export const metadata = { }, }; -const CertsLandingPage: FC = () => { - return ( -
-
-

- Find certificate history for any domain -

-
- -
-
+const CertsLandingPage: FC = () => ( +
+
+
+
+

+ Find certificate history for any domain +

+
+ +
+

+ Find all DNS records, WHOIS data, SSL/TLS certificate history, + subdomains and more +

+
+ +
- - -
-

- About Certificate Logs -

-

- Certificate Transparency (CT) logs are public records that track the - issuance of SSL/TLS certificates, providing a transparent and - verifiable system for monitoring certificates issued by Certificate - Authorities (CAs). These logs are append-only and publicly accessible, - allowing anyone to audit and review certificates issued for domains. - By referencing CT logs, administrators can verify that no unauthorized - or misissued certificates have been generated for their domains, - ensuring the integrity of their SSL/TLS implementations. -

-

- From a technical perspective, Certificate Transparency logs are - crucial for improving security by detecting certificate misissuance - and potential attacks such as man-in-the-middle. By integrating CT log - monitoring, domain owners can receive real-time alerts when a new - certificate is issued for their domain, allowing them to respond - quickly to any anomalies. CT logs also enhance trust across the web by - providing an open system that anyone can query to audit certificate - issuance. This mechanism is critical for maintaining a secure web - environment and ensuring SSL/TLS certificates are properly issued and - managed. -

-
+
- ); -}; + +
+

+ About Certificate Logs +

+

+ Certificate Transparency (CT) logs are public records that track the + issuance of SSL/TLS certificates, providing a transparent and verifiable + system for monitoring certificates issued by Certificate Authorities + (CAs). These logs are append-only and publicly accessible, allowing + anyone to audit and review certificates issued for domains. By + referencing CT logs, administrators can verify that no unauthorized or + misissued certificates have been generated for their domains, ensuring + the integrity of their SSL/TLS implementations. +

+

+ From a technical perspective, Certificate Transparency logs are crucial + for improving security by detecting certificate misissuance and + potential attacks such as man-in-the-middle. By integrating CT log + monitoring, domain owners can receive real-time alerts when a new + certificate is issued for their domain, allowing them to respond quickly + to any anomalies. CT logs also enhance trust across the web by providing + an open system that anyone can query to audit certificate issuance. This + mechanism is critical for maintaining a secure web environment and + ensuring SSL/TLS certificates are properly issued and managed. +

+
+
+); export default CertsLandingPage; diff --git a/app/(landing)/map/page.tsx b/app/(landing)/map/page.tsx index a551a1b..e79dcaf 100644 --- a/app/(landing)/map/page.tsx +++ b/app/(landing)/map/page.tsx @@ -1,66 +1,73 @@ import type { FC } from 'react'; import { SearchForm } from '../../_components/search-form'; +import { AuthorSection } from '../_components/author-section'; +import { FeaturesSection } from '../_components/features-section'; import { SponsorsSection } from '../_components/sponsors-section'; -import { AuthorSection } from './../_components/author-section'; -import { TrustedBySection } from './../_components/trusted-by-section'; +import { TrustSection } from '../_components/trust-section'; export const revalidate = 86400; // 24 hours export const metadata = { openGraph: { - url: '/map', + url: '/', }, alternates: { - canonical: '/map', + canonical: '/', }, }; -const MapLandingPage: FC = () => { - return ( -
-
-

- Run DNS lookups across multiple regions -

-
- -
-
+const MapLandingPage: FC = () => ( +
+
+
+
+

+ Run DNS lookups across multiple regions +

+
+ +
+

+ Find all DNS records, WHOIS data, SSL/TLS certificate history, + subdomains and more +

+
+ +
- - -
-

- About DNS Map -

-

- The DNS Map tool (also known as Global DNS) is particularly useful for - debugging Content Delivery Network (CDN) setups and checking DNS - propagation. CDNs rely on DNS to route users to the nearest server for - optimal performance. Any misconfiguration in DNS records, such as - CNAME or A records pointing to the CDN, can affect website performance - or lead to downtime. By using DNS Map, you can run DNS queries from 18 - different global locations to see how your CDN's DNS entries are - resolved worldwide, ensuring that users are being directed to the - correct CDN nodes based on their geographic location. -

-

- Additionally, DNS Map helps in monitoring DNS propagation after making - changes to CDN configurations. DNS changes, such as updates to CNAME - records pointing to your CDN provider, can take time to propagate - across all DNS servers. With DNS Map, you can track the progress of - these changes by running queries from multiple locations, ensuring - that the new DNS records are properly propagated across different - regions. This allows you to catch potential delays or caching issues - early and ensure that your CDN is delivering content efficiently to - users globally. -

-
+
- ); -}; + +
+

+ About DNS Map +

+

+ The DNS Map tool (also known as Global DNS) is particularly useful for + debugging Content Delivery Network (CDN) setups and checking DNS + propagation. CDNs rely on DNS to route users to the nearest server for + optimal performance. Any misconfiguration in DNS records, such as CNAME + or A records pointing to the CDN, can affect website performance or lead + to downtime. By using DNS Map, you can run DNS queries from 18 different + global locations to see how your CDN's DNS entries are resolved + worldwide, ensuring that users are being directed to the correct CDN + nodes based on their geographic location. +

+

+ Additionally, DNS Map helps in monitoring DNS propagation after making + changes to CDN configurations. DNS changes, such as updates to CNAME + records pointing to your CDN provider, can take time to propagate across + all DNS servers. With DNS Map, you can track the progress of these + changes by running queries from multiple locations, ensuring that the + new DNS records are properly propagated across different regions. This + allows you to catch potential delays or caching issues early and ensure + that your CDN is delivering content efficiently to users globally. +

+
+
+); export default MapLandingPage; diff --git a/app/(landing)/page.tsx b/app/(landing)/page.tsx index 4ca0802..c2d9f4b 100644 --- a/app/(landing)/page.tsx +++ b/app/(landing)/page.tsx @@ -4,7 +4,7 @@ import { SearchForm } from '../_components/search-form'; import { AuthorSection } from './_components/author-section'; import { FeaturesSection } from './_components/features-section'; import { SponsorsSection } from './_components/sponsors-section'; -import { TrustedBySection } from './_components/trusted-by-section'; +import { TrustSection } from './_components/trust-section'; export const revalidate = 86400; // 24 hours @@ -17,24 +17,32 @@ export const metadata = { }, }; -const MainLandingPage: FC = () => { - return ( -
-
-

- Get details about any Domain -

-
- -
-
- - +const MainLandingPage: FC = () => ( +
+
+
+
+

+ Get details about any Domain +

+
+ +
+

+ Find all DNS records, WHOIS data, SSL/TLS certificate history, + subdomains and more +

+
+ +
+ - - + +
- ); -}; + + +
+); export default MainLandingPage; diff --git a/app/(landing)/subdomains/page.tsx b/app/(landing)/subdomains/page.tsx index 29ddd16..3d05685 100644 --- a/app/(landing)/subdomains/page.tsx +++ b/app/(landing)/subdomains/page.tsx @@ -1,9 +1,9 @@ import type { FC } from 'react'; import { SearchForm } from '../../_components/search-form'; +import { AuthorSection } from '../_components/author-section'; import { SponsorsSection } from '../_components/sponsors-section'; -import { AuthorSection } from './../_components/author-section'; -import { TrustedBySection } from './../_components/trusted-by-section'; +import { TrustSection } from '../_components/trust-section'; export const revalidate = 86400; // 24 hours @@ -16,52 +16,59 @@ export const metadata = { }, }; -const SubdomainsLandingPage: FC = () => { - return ( -
-
-

- Find hidden subdomains for any domain -

-
- -
-
+const SubdomainsLandingPage: FC = () => ( +
+
+
+
+

+ Find hidden subdomains for any domain +

+
+ +
+

+ Find all DNS records, WHOIS data, SSL/TLS certificate history, + subdomains and more +

+
+ +
- - -
-

- What is a Subdomain Finder? -

-

- A subdomain enumeration tool is designed to discover hidden or - overlooked subdomains associated with a domain. Subdomains can often - expose additional services, development environments, or unprotected - areas of a website that might not be directly visible. These tools - systematically scan various sources such as DNS records, SSL - certificates, search engines, and Certificate Transparency logs to - identify subdomains that may have been missed during standard checks. - For security professionals, developers, and network administrators, - finding hidden subdomains is critical to ensuring all assets are - accounted for and properly secured. -

-

- Technically, subdomain enumeration tools are essential for identifying - potential security risks. Hidden subdomains can sometimes expose - internal resources or outdated systems, making them potential targets - for attackers. By using these tools, organizations can discover and - secure vulnerable subdomains, preventing unauthorized access or - exploitation. Regular subdomain scans also help in inventory - management, ensuring that all public-facing assets are monitored and - updated as needed. This type of reconnaissance is a key component of - maintaining a secure network infrastructure. -

-
+
- ); -}; + +
+

+ What is a Subdomain Finder? +

+

+ A subdomain enumeration tool is designed to discover hidden or + overlooked subdomains associated with a domain. Subdomains can often + expose additional services, development environments, or unprotected + areas of a website that might not be directly visible. These tools + systematically scan various sources such as DNS records, SSL + certificates, search engines, and Certificate Transparency logs to + identify subdomains that may have been missed during standard checks. + For security professionals, developers, and network administrators, + finding hidden subdomains is critical to ensuring all assets are + accounted for and properly secured. +

+

+ Technically, subdomain enumeration tools are essential for identifying + potential security risks. Hidden subdomains can sometimes expose + internal resources or outdated systems, making them potential targets + for attackers. By using these tools, organizations can discover and + secure vulnerable subdomains, preventing unauthorized access or + exploitation. Regular subdomain scans also help in inventory management, + ensuring that all public-facing assets are monitored and updated as + needed. This type of reconnaissance is a key component of maintaining a + secure network infrastructure. +

+
+
+); export default SubdomainsLandingPage; diff --git a/app/(landing)/whois/page.tsx b/app/(landing)/whois/page.tsx index f50147c..b244ef8 100644 --- a/app/(landing)/whois/page.tsx +++ b/app/(landing)/whois/page.tsx @@ -1,9 +1,9 @@ import type { FC } from 'react'; import { SearchForm } from '../../_components/search-form'; +import { AuthorSection } from '../_components/author-section'; import { SponsorsSection } from '../_components/sponsors-section'; -import { AuthorSection } from './../_components/author-section'; -import { TrustedBySection } from './../_components/trusted-by-section'; +import { TrustSection } from '../_components/trust-section'; export const revalidate = 86400; // 24 hours @@ -16,50 +16,57 @@ export const metadata = { }, }; -const WhoisLandingPage: FC = () => { - return ( -
-
-

- Find WHOIS information for any domain -

-
- -
-
+const WhoisLandingPage: FC = () => ( +
+
+
+
+

+ Find WHOIS information for any domain +

+
+ +
+

+ Find all DNS records, WHOIS data, SSL/TLS certificate history, + subdomains and more +

+
+ +
- - -
-

- About WHOIS -

-

- WHOIS is a protocol used to retrieve detailed information about domain - names and IP addresses. A WHOIS lookup provides essential data such as - the domain owner, registration dates, and contact information. This - information is stored by domain registrars and can be accessed - publicly, making it a valuable tool for network administrators, web - developers, and cybersecurity professionals. By querying WHOIS, you - can verify the status of a domain, check its expiration date, and see - the administrative and technical contacts associated with it. -

-

- From a technical perspective, WHOIS is useful for domain research, - ensuring proper domain registration management, and tracking the - ownership of websites. It’s particularly important for verifying - domain availability, identifying the current owner, and preventing - domain squatting. Additionally, WHOIS is often used in cybersecurity - to trace the origins of suspicious activity or investigate potentially - fraudulent websites. For those managing domains or working in network - security, WHOIS offers a direct method to gather critical information - about the internet infrastructure. -

-
+
- ); -}; + +
+

+ About WHOIS +

+

+ WHOIS is a protocol used to retrieve detailed information about domain + names and IP addresses. A WHOIS lookup provides essential data such as + the domain owner, registration dates, and contact information. This + information is stored by domain registrars and can be accessed publicly, + making it a valuable tool for network administrators, web developers, + and cybersecurity professionals. By querying WHOIS, you can verify the + status of a domain, check its expiration date, and see the + administrative and technical contacts associated with it. +

+

+ From a technical perspective, WHOIS is useful for domain research, + ensuring proper domain registration management, and tracking the + ownership of websites. It’s particularly important for verifying domain + availability, identifying the current owner, and preventing domain + squatting. Additionally, WHOIS is often used in cybersecurity to trace + the origins of suspicious activity or investigate potentially fraudulent + websites. For those managing domains or working in network security, + WHOIS offers a direct method to gather critical information about the + internet infrastructure. +

+
+
+); export default WhoisLandingPage; diff --git a/app/_components/feedback-prompt.tsx b/app/_components/feedback-prompt.tsx index dcd881e..fbbfb9d 100644 --- a/app/_components/feedback-prompt.tsx +++ b/app/_components/feedback-prompt.tsx @@ -6,8 +6,8 @@ import ms from 'ms'; import { usePlausible } from 'next-plausible'; import { type FC, useCallback, useState } from 'react'; -import { Alert } from '@/components/ui/alert'; import { Button } from '@/components/ui/button'; +import { Card } from '@/components/ui/card'; import { Dialog, DialogContent, @@ -54,7 +54,7 @@ export const FeedbackPrompt: FC = () => { <> {visible && (
- + )}