cruip / tailwind-landing-page-template Goto Github PK

Simple Light is a free landing page template built on top of TailwindCSS and fully coded in React / Next.js. Made by

JavaScript 5.00% CSS 7.44% TypeScript 87.56%

free landing landing-page nextjs page react reactjs startup tailwind tailwindcss vite vitejs

tailwind-landing-page-template's Introduction

Free Tailwind landing page template

Simple Light is a free landing page template built on top of TailwindCSS and fully coded in React / Next.js. Simple light is designed to provide all the basic components a developer need to create a landing page for SaaS products, online services, and more. Use it for whatever you want, and be sure to reach us out on Twitter if you build anything cool/useful with it. Created and maintained with ❤️ by Cruip.com.

Version 1.3.3 built with Tailwind CSS and React + Vite is available here.

Live demo

Check the live demo here 👉️ https://simple.cruip.com/

Simple Pro

Design files

If you need the design files, you can download them from Figma's Community 👉 https://bit.ly/3HOZMpf

Usage

This is a Next.js project bootstrapped with create-next-app.

Getting Started

First, run the development server:

npm run dev
# or
yarn dev
# or
pnpm dev

Open http://localhost:3000 with your browser to see the result.

You can start editing the page by modifying app/page.tsx. The page auto-updates as you edit the file.

API routes can be accessed on http://localhost:3000/api/hello. This endpoint can be edited in pages/api/hello.ts.

The pages/api directory is mapped to /api/*. Files in this directory are treated as API routes instead of React pages.

This project uses next/font to automatically optimize and load Inter, a custom Google Font.

Learn More

To learn more about Next.js, take a look at the following resources:

Next.js Documentation - learn about Next.js features and API.
Learn Next.js - an interactive Next.js tutorial.

You can check out the Next.js GitHub repository - your feedback and contributions are welcome!

Deploy on Vercel

The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.

Check out our Next.js deployment documentation for more details.

Support notes

This template has been developed with the App Router (app) and React Server Components. If you’re unfamiliar with these beta features, you can find more information about them on the Next.js beta documentation page. So, please note that any request dealing with React (e.g. extra features, customisations, et cetera) is to be considered out of the support scope.

For more information about what support covers, please see our (FAQs)[https://cruip.com/faq/].

Credits

Nucleo

Terms and License

Released under the GPL.
Copyright 2024 Cruip.
Use it for personal and commercial projects, but please don’t republish, redistribute, or resell the template.
Attribution is not required, although it is really appreciated.

About Us

We're an Italian developer/designer duo creating high-quality design/code resources for developers, makers, and startups.

Stay in the loop

If you would like to know when we release new resources, you can follow us on Twitter, or you can subscribe to our monthly newsletter.

tailwind-landing-page-template's People

Contributors

Stargazers

Watchers

Forkers

bitbrothers empire7sv muralielan javiergomezve anoona-co saxenaudit inthescript chebeto niklasmtj goudarziha xokp ivbrajkovic ravipatel2293 julitroalves leroyg sidsol eric-guo princedhimanz weisk justmelnyc mkokes chinadean rsccc subhanbakh roldanjr designemail kiaramedina yikayiyo inier amilajack trusis666 mdrobbins rowe-morehouse vedovelli gabrielf9 bydiogosampaio blakegreendev devinclane ideabrian msypniewski weisisheng adash doc22940 cryptixcoder meetshujah zzzcdf maifeeulasad lgs llwire jogeshpi03 xunzhaotech pauxiel bonjur owlsecco godsfavoritedeveloper clued-media recepdmr vihermawan dzineer tamojit-123 skyblueballykid eddwan muscatis trendingtechnology joshuatonga ek018 bpncodes 2700036 gkarecki bitcreative-studios velasco rezapurnamaa 262media simonweniger johnsage25 pcdotfan yassinehamouten amirulahmad blunodes-com denisassoti ikigai-pt wagneraraujo skellenb stuckinaboot trsxnn lockdzn eikebartels srmarohit ryan-ally buzzeins anhphi67 mohau-r the-defi-network buddynice tahirmq1 jamessom jmccar cartier31038 kennstack01 swazidr

tailwind-landing-page-template's Issues

App is blank once I build it

Hi! I've been trying to build the app using npm run build the build is created successfully no errors at all but when I try to open the link the page is blank.

This is the only error that I get. Any ideas on what might be causing this?

It works fine on dev mode.

Failed To Compile

Failed to compile
./components/ui/header.tsx
Module parse failed: Bad character escape sequence (2:123)
| import { createProxy } from "next/dist/build/webpack/loaders/next-flight-loader/module-proxy"

const proxy = createProxy("C:\Users\HP\Desktop\dev\Tech-Stack\CSS\Tailwind\Tailwind-landing-page\open-pro-next\components\ui\header.tsx")
|
| // Accessing the __esModule property and exporting $$typeof are required here.
This error occurred during the build process and can only be dismissed by fixing the error..

Testimonial image not in the right place

When I open the website in mobile and then refreshing the page the testimonial image moves up.

breaking error - Module parse failed: Bad character escape sequence (2:97)

"use client" in header.tsx is causing issue

File was processed with these loaders:

./node_modules/next/dist/build/webpack/loaders/next-flight-loader/index.js
./node_modules/next/dist/build/webpack/loaders/next-swc-loader.js
You may need an additional loader to handle the result of these loaders.
| import { createProxy } from "next/dist/build/webpack/loaders/next-flight-loader/module-proxy"

you can update next js to 13.3.1-canary.4

npm

npm i [email protected]

yarn

yarn add [email protected]

Does not work perfectly on mobile

the sections have big overlap.

Seo

Hi how can i add SEO support to this website?

instructions

Hi.

New to npm/node/react.

Just saw your app, and want to install/try it. I saw the prior issue said the person tried to install/run the app and got a blank page.

Could I ask you to post a short/complete set of instructions for how to install the app, as well as running/viewing the test app.

Something like:

Install npm/node

using linux:
use yum to
yum install node

Test_001_projekt

Query About Placement of Google Analytics Tag

Hello,

I'm using the website template and I'm looking to integrate Google Analytics. Could you please advise on where exactly should the Google Analytics tag be placed in the template?

Thanks for your help!