Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/timb-103/nuxt-testimonial
Create a Twitter testimonial wall for your Nuxt website.
https://github.com/timb-103/nuxt-testimonial
nuxt testimonial twitter
Last synced: 1 day ago
JSON representation
Create a Twitter testimonial wall for your Nuxt website.
- Host: GitHub
- URL: https://github.com/timb-103/nuxt-testimonial
- Owner: timb-103
- Created: 2023-08-15T00:52:52.000Z (about 1 year ago)
- Default Branch: master
- Last Pushed: 2023-08-16T00:38:37.000Z (about 1 year ago)
- Last Synced: 2024-09-17T02:04:55.625Z (about 2 months ago)
- Topics: nuxt, testimonial, twitter
- Language: Vue
- Homepage: https://nuxt-testimonial.vercel.app
- Size: 3.74 MB
- Stars: 6
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Nuxt Testimonial
[![npm version][npm-version-src]][npm-version-href]
[![Nuxt][nuxt-src]][nuxt-href]
> Create a Twitter testimonial wall for your Nuxt website.
- [Live Demo](https://nuxt-testimonial.vercel.app/)
## Features
- 👏🏻 Show off your favourite tweets
- 🍱 Customizable Masonry layout
- 💿 Server side cached for speed
- 🌪 No layout shift (SSR)
- ⚡ Fast & Easy setup
- 🦥 Lazy loading
## Quick Setup
1. Add `nuxt-testimonial` dependency to your project
```bash
npm install --save-dev nuxt-testimonial
```
2. Add `nuxt-testimonial` to the `modules` section of `nuxt.config.ts`
```js
export default defineNuxtConfig({
modules: ["nuxt-testimonial"],
});
```
That's it! You can now use Nuxt Testimonial in your Nuxt app ✨
## Usage
We provide a simple `` component that you can add to your website.
**Example**
```vue
const ids = [
"1683982469752840193",
// ... more twitter ids
];
const columns = ref(2);
const width = ref(200);
```
We also provide a simple Tweet component if you want to build your own integrations:
```vue
const id = "1683982469752840193";
```
[npm-version-src]: https://img.shields.io/npm/v/nuxt-testimonial/latest.svg?style=flat&colorA=18181B&colorB=28CF8D
[npm-version-href]: https://npmjs.com/package/nuxt-testimonial
[npm-downloads-src]: https://img.shields.io/npm/dm/nuxt-testimonial.svg?style=flat&colorA=18181B&colorB=28CF8D
[npm-downloads-href]: https://npmjs.com/package/nuxt-testimonial
[license-src]: https://img.shields.io/npm/l/nuxt-testimonial.svg?style=flat&colorA=18181B&colorB=28CF8D
[license-href]: https://npmjs.com/package/nuxt-testimonial
[nuxt-src]: https://img.shields.io/badge/Nuxt-18181B?logo=nuxt.js
[nuxt-href]: https://nuxt.com