scientia-website

scientia-site

Corporate website of ООО «Скиентия» (scientia.ru), rebuilt from Tilda as a static site.

Stack: Astro 7 · Tailwind CSS 4 · TypeScript · Inter / Inter Tight (Cyrillic). Zero client-side JS except the mobile menu and the contact form (which composes an email via mailto:).

Design direction: cinematic and product-led, taking cues from porsche.com (full-viewport photo stages, oversized display type with the accent-dot period, circular arrow chips, stark black/white with the brand yellow #ffca41) and rocscience.com (full-bleed mine photography, pill CTAs, section-header + card-deck patterns). The home page is a sequence of full-bleed "stages": hero → services grid → one stage per product → why-us → clients → community tiles → contact.

Commands

npm install        # install dependencies
npm run dev        # dev server at http://localhost:4321
npm run build      # static build into dist/
npm run preview    # serve the dist/ build locally
npm run fetch-news # refresh the Telegram widget posts (src/data/telegram-news.json)

Telegram widget

The home-page hero shows a Telegram-style chat window with the latest posts from @scientia_ru. Posts are fetched from the public t.me/s/scientia_ru feed at build time by npm run fetch-news (output: src/data/telegram-news.json, channel avatar in public/images/telegram-avatar.jpg). Run it before each deploy to refresh the news — the widget itself is static HTML, no third-party JS at runtime.

Deployment

The build in dist/ is fully static — upload it to any hosting (VPS + nginx, or shared hosting). Suggested nginx config: serve dist/ with try_files $uri $uri/ $uri/index.html. The existing DDoS-Guard setup can stay in front unchanged.

Structure

src/
  layouts/Base.astro      # <head>, SEO meta, header, footer
  components/             # Header, Footer, CTAForm, PageHero, Logo
  data/                   # site contacts, services, products, publications,
                          # license docs, release notes, privacy policy
  pages/                  # one .astro page per original Tilda URL (slugs preserved)
  styles/global.css       # Tailwind v4 theme (brand accent #ffca41, night palette)
public/images/            # all images migrated from Tilda CDN
scripts/                  # one-off migration helpers (scrape, download-images)
.scratch/                 # raw scraped HTML/JSON from the old site (not deployed)

Notes

• Original page URLs are preserved (/prorock, /digger, /personal_data, …) so existing links and SEO carry over.
• Original slug /prorockfeatures, /diggerslope_updates kept as-is; new pages can be added with clean slugs later and 301-redirects configured on the server.
• Contact/subscribe forms currently open the visitor's mail client. To post to a real backend, replace the submit handler in src/components/CTAForm.astro and src/pages/subscribe.astro.
• Blog (Teletype), Wiki (MediaWiki) and the education portal stay external, as on the old site.