Blog app using different modern technology like Next.js, ReactJS, TailwindCSS, GraphQL, GraphCMS, JavaScript, TypeScript, ...

Overview

Tony Blog

Blog app using different modern technology like Next.js, ReactJS, TailwindCSS, GraphQL, GraphCMS, JavaScript, TypeScript, ...

Link Blog: https://tony-blog-eta.vercel.app/

Features:

  • Modern views
  • Using GraphCMS to manage blog's content
  • Navbar with link to Server Statically Generated support by Next.js
  • View list Featured Posts
  • View list Post Cards
  • Recent Posts / Related Posts
  • Adjacent Posts
  • Categories
  • Post details with multiple information: author, content, moment, ...
  • Comments
  • ...

Amazing View:

Homepage

image

Post Detail

image

Adjacent Posts

image

Comments

image

Next.js + Tailwind CSS Example

This example shows how to use Tailwind CSS (v3.0) with Next.js. It follows the steps outlined in the official Tailwind docs.

Deploy your own

Deploy the example using Vercel or preview live with StackBlitz

Deploy with Vercel

How to use

Execute create-next-app with npm or Yarn to bootstrap the example:

npx create-next-app --example with-tailwindcss with-tailwindcss-app
# or
yarn create next-app --example with-tailwindcss with-tailwindcss-app

Deploy it to the cloud with Vercel (Documentation).

You might also like...
Boilerplate for a Blog based on React.js, Node.js & Next.js
Boilerplate for a Blog based on React.js, Node.js & Next.js

Boilerplate for a Blog based on React.js, Node.js & Next.js

A simple boilerplate for a Blog based on React.js & Next.js.
A simple boilerplate for a Blog based on React.js & Next.js.

OMISOFT BLOG EXAMPLE - FRONT END Here you can find a simple boilerplate for a Blog based on React.js & Next.js. We use this code in the project Sudoku

Boilerplate for a Blog based on React.js, Node.js & Next.js
Boilerplate for a Blog based on React.js, Node.js & Next.js

OMISOFT BLOG EXAMPLE - ADMIN PANEL Here you can find a simple boilerplate for a Blog based on React.js & Next.js. We use this code in the project Sudo

DevBlogs - Blog designado e desenvolvido por mim, utilizando ReactJS!!
DevBlogs - Blog designado e desenvolvido por mim, utilizando ReactJS!!

This project was bootstrapped with Create React App. Below you will find some information on how to perform common tasks. You can find the most recent

React-calculator - A calculator using React, TypeScript, Vite.js and TailwindCSS, inspired by iOS calculator UI

React Calculator A calculator inspired by iOS calculator UI. Live demo here. Tab

A React boilerplate with Typescript using Vite. Includes React-query, Zustand, Tailwindcss, EsLint + Prettier, Husky Commit Lint

A React boilerplate with Typescript using Vite. Includes React-query, Zustand, Tailwindcss, EsLint + Prettier, Husky Commit Lint

🐦 Modern JavaScript Development Ecosystem
🐦 Modern JavaScript Development Ecosystem

Roc Build JavaScript projects easily using modern libraries. Quickly create products powered by libraries like Koa, React and Redux ready for deployme

Completely static, built with Next.js, Preact, and TailwindCSS

Oxygen Updater website Completely static, built with Next.js, Preact, and TailwindCSS. Detailed setup instructions may follow in a later commit. Getti

A collection of 14 different React projects like Music Player, Weather App, Crypto Tracker, Chat Room, Currency Converter, COVID Tracker, To-do and Expense App, Color Generator etc.

Simple React Projects Note: If any project does not work Online download the project and run on your local Storage (Error is coming due to Local Stora

MD Yasin 22 Sep 15, 2022
A developer blog starter for 2021 (Next.js + React + TypeScript + Markdown + syntax highlighting)

Devii A developer blog starter for 2020. Next.js React TypeScript Markdown syntax highlighting SEO RSS generation if you're happy and you know it, sta

Colin McDonnell 464 Jan 4, 2023
Use TypeScript, TailwindCSS & Sass to quick start your new Next.js app!!

Next.js TypeScript TailwindCSS & Sass Starter Use TypeScript, TailwindCSS & Sass to quick start your new Next.js app!! ⚡️ Quick Start ?? Getting Start

MikevPeeren 21 Dec 19, 2022
Project modern ui ux restaurant - A Modern UI/UX Restaurant Landing Page Website Built Using React

Restaurant Landing Page Live Site Stay up to date with new projects New major pr

Adrian Hajdin - JavaScript Mastery 833 Dec 30, 2022
ArtemisQL is a GraphQL migration and database visualizer tool that empowers developers to build GraphQL schemas with ease.

ArtemisQL A GraphQL migration tool and relational database visualizer ?? Overview ArtemisQL is an open-source web application providing a SQL (Postgre

OSLabs Beta 108 Sep 23, 2022
Gab 3 Mar 5, 2022
:point_up::running: Modern Relay Starter Kit - Integrated with Relay, GraphQL, Express, ES6/ES7, JSX, Webpack, Babel, Material Design Lite, and PostCSS

Relay Fullstack is a Relay scaffolding application that aims to help you get up and running a project without worrying about integrating tools. It com

Varayut Lerdkanlayanawat 991 Dec 30, 2022
Boilerplate in typescript with : Next / Next-Auth / Siwe / Web3modal / useDapp / next-i18n / reactMUI

Boilerplate in typescript with : Next / Next-Auth / Siwe / Web3modal / useDapp / next-i18n / reactMUI

null 16 Dec 18, 2022
Official Documentation and Blog for the Review Bots Website. Made with Love using React, Docusaurus and Typescript

Official Documentation and Blog for the Review Bots Website. Made with Love using React, Docusaurus and Typescript

ReviewBots 3 Jul 28, 2022
My project of personal blog using my knowledge in Node, Nest, React and Typescript

A progressive Node.js framework for building efficient and scalable server-side applications. Description Nest framework TypeScript starter repository

Victor Antonino Costa 8 Dec 24, 2022