diff --git a/components/Testimonial.js b/components/Testimonial.js index a4be27179549..52b48f2a2ecc 100644 --- a/components/Testimonial.js +++ b/components/Testimonial.js @@ -1,35 +1,80 @@ -import Paragraph from "./typography/Paragraph"; +import ArrowLeft from '../components/icons/ArrowLeft' +import ArrowRight from '../components/icons/ArrowRight' +import { useState, useEffect } from 'react'; +import testimonials from './TestimonialData'; + +const TestimonialCarousel = () => { + const [activeIndex, setActiveIndex] = useState(0); + const len = testimonials.length; + + const goToPrevious = () => { + setActiveIndex((prevIndex) => (prevIndex === 0 ? len - 1 : prevIndex - 1)); + }; + + const goToNext = () => { + setActiveIndex((prevIndex) => (prevIndex === len - 1 ? 0 : prevIndex + 1)); + }; + + const goToIndex = (index) => { + setActiveIndex(index); + }; + + useEffect(() => { + const interval = setInterval(goToNext, 10000); + return () => { + clearInterval(interval); + }; + }, [activeIndex]); -export default function Testimonial({ - className = '', - text, - authorName, - authorDescription, - authorAvatar, -}) { return ( -
  • -
    -
    - - - - - {text} - -
    - -
    -
  • - ) -} + + ); +}; + +export default TestimonialCarousel; diff --git a/components/TestimonialData.js b/components/TestimonialData.js new file mode 100644 index 000000000000..ce62e891848b --- /dev/null +++ b/components/TestimonialData.js @@ -0,0 +1,28 @@ +const TestimonialData = [ + { + imgUrl: '/img/testimonials/matt-mclarty.jpg', + name: 'Matt McLarty', + salutation: 'Global Leader of API Strategy at MuleSoft', + text: 'Microservices underline the need for event-based communication in distributed architectures. AsyncAPI brings the richness of the REST API ecosystem to asynchronous APIs.', + }, + { + imgUrl: '/img/testimonials/bill-doerrfeld.jpg', + name: 'Bill Doerrfeld', + salutation: 'Editor in Chief at Nordic APIs', + text: 'Event-driven APIs need love too! AsyncAPI brings the many benefits of a machine/human readable specification to these nuanced approaches.', + }, + { + imgUrl: '/img/testimonials/jonathan-schabowsky.jpg', + name: 'Jonathan Schabowsky', + salutation: 'Sr. Architect, Office of the CTO at Solace', + text: "Developers need to be able to quickly and consistently create event-driven applications that provide business value and react to customer needs in realtime. I can't count how many times I've heard developers ask for OpenAPI/Swagger style tools for the asynchronous and event driven world, and that is exactly what the AsyncAPI initiative is making a reality.", + }, + { + imgUrl: '/img/testimonials/eric-horesnyi.jpg', + name: 'Eric Horesnyi', + salutation: 'CEO at Streamdata.io', + text: 'We’ve been focusing on event-driven APIs since 2014 and thank the AsyncAPI contributors everyday for driving the community towards common standards.', + }, + ]; + + export default TestimonialData \ No newline at end of file diff --git a/pages/index.js b/pages/index.js index bd81837570e7..b56a8202aeab 100644 --- a/pages/index.js +++ b/pages/index.js @@ -15,7 +15,153 @@ function HomePage() {
    Loading...
    - + + + Join our great community! + + + We're a community of great people who are passionate about AsyncAPI and event-driven architectures. + +
    + +
    +
    + +
    +
    +
    + + Join our Slack workspace + + + We welcome everyone to join our Slack workspace. If you have a question on how to use AsyncAPI, want to contribute, or simply want to say hello 👋  you're welcome to join us. We're nice people 🙂 + +
    +
    +
    +
    +
    + +
    +
    + +
    +
    +
    + + Join our public meetings + + + AsyncAPI hosts different meetings every week. They are focused on different topic, sometimes purely technical and sometimes about community building. Pick one and join us! + + + Learn more about our meetings. + + +
      +
    • + +
    • +
    • + +
    • +
    • + +
    • +
    +
    +
    +
    +
    + + + +
    + +
    + + +
    + + + Platinum Sponsors + + + + + + + Gold Sponsors + + + + + + + Silver Sponsors + + + + + + + + Want to Sponsor Us? + + + These great organizations are already supporting AsyncAPI. Want to become a sponsor? + + Support us! + + + +
    + + + Supported by + + + The following companies support us by letting us use their products for free. Interested in supporting us too? + + Email us + for more info. + + + + + + What the experts are saying + + + + ) }