flexilla icon indicating copy to clipboard operation
flexilla copied to clipboard

Improve Flexilla Documentation and Add Interactive Examples

Open Johnkat-Mj opened this issue 1 year ago • 17 comments

Hello, Hacktoberfest participants!

We’re inviting talented developers to contribute to Flexilla, a CSS framework-agnostic library designed for interactive components like dropdowns, accordions, tabs and more.

What we need:

We’re looking for contributors to help enhance the Flexilla library in a few key areas:

  1. Add Component Descriptions:

    • Expand on the existing component documentation to include detailed descriptions for each component (dropdown, accordion, tabs, etc.).
    • Explain the purpose of each component, how it works, and the benefits of using it in various projects.
  2. Usage Examples:

    • Add code snippets to demonstrate how to use each component with different CSS frameworks (TailwindCSS, UnoCSS, or plain CSS).
    • Where applicable, include examples of custom configurations or additional options.
  3. Interactive Demos:

    • If possible, create interactive examples using tools like CodeSandbox or CodePen that allow users to see the components in action and experiment with them directly.
    • Link these examples in the documentation to improve understanding and engagement.
  4. Getting Started Guide:

    • Enhance the “Getting Started” section to guide users through the setup and installation process, including npm, CDN, and script-based installation methods.
    • Clarify the dependencies and any prerequisites needed for setting up Flexilla.
  5. FAQ Section:

    • Add an FAQ section to address common questions and troubleshooting tips.
    • Include answers on compatibility, component usage, and configuration options.

Resources

To get you started, check out Flexilla's documentation and explore our existing codebase. These resources will provide you with a clear understanding of how Flexilla works and where you can contribute. Also you can read this blog post to understand the motivation behind the creation of this tool.

Recap Tasks

  • [ ] faq section
  • [ ] getting started guide
  • [ ] interactive demos
  • [ ] usage examples
  • [ ] component descriptions

Additional Notes:

Feel free to contribute with your own ideas for improving the documentation. If you need any assistance or have questions, reach out, and we’ll be happy to help! Your work will greatly enhance Flexilla's usability and user experience for developers worldwide.

Johnkat-Mj avatar Oct 09 '24 17:10 Johnkat-Mj

Hey @Johnkat-Mj does all the 5 changes come under 1 pr or 1 pr for each ie 5 pr in total?

hemangtk avatar Oct 09 '24 21:10 hemangtk

Hey @hemangtk 1 change 1 PR Each PR must contain only 1 change

Johnkat-Mj avatar Oct 09 '24 21:10 Johnkat-Mj

Thanks for your reply @Johnkat-Mj i would like to work on the faqs section could you please assign me the issue

hemangtk avatar Oct 09 '24 21:10 hemangtk

@hemangtk done and let me know if you need some more details

Johnkat-Mj avatar Oct 09 '24 21:10 Johnkat-Mj

hey @Johnkat-Mj just a quick question to know if i have understood the issue properly as i can see theres already faq section, do you want to me add relevent questions there? image

hemangtk avatar Oct 10 '24 06:10 hemangtk

Hey @hemangtk Although there's already an FAQ section, it doesn't cover everything at the moment. You can review it and make improvements, or add more questions and answers if possible... Just make it clear ... Also check https://flexilla-docs.vercel.app/docs/getting-started

Johnkat-Mj avatar Oct 10 '24 06:10 Johnkat-Mj

got it! so you want me to make changes in the docs page or the home page really sorry for the questions but just making sure i do the right job

hemangtk avatar Oct 10 '24 06:10 hemangtk

@hemangtk in both, if you can

Johnkat-Mj avatar Oct 10 '24 06:10 Johnkat-Mj

Hey @Johnkat-Mj as I have other issues to work on as well I would like to update the faq section where it is prioritised

hemangtk avatar Oct 10 '24 07:10 hemangtk

@hemangtk Okay, just do what's right. Also don't forget to mention this issue in the PR. A star ✨ on this repository can also help.

Johnkat-Mj avatar Oct 10 '24 07:10 Johnkat-Mj

@Johnkat-Mj i would like to work on Getting Started Guide: could you please assign me.

gpatchikoru avatar Oct 10 '24 15:10 gpatchikoru

this one also Interactive Demos: also first i will work on Getting Started Guide:

gpatchikoru avatar Oct 10 '24 15:10 gpatchikoru

@gpatchikoru right, I'm gonna do this soon

Johnkat-Mj avatar Oct 10 '24 16:10 Johnkat-Mj

yes, okay thank you.

gpatchikoru avatar Oct 10 '24 16:10 gpatchikoru

updated branch for Getting Started Guide. please check pr request let me know any feedback pr:https://github.com/unify-ui-dev/flexilla/pull/93

gpatchikoru avatar Oct 11 '24 04:10 gpatchikoru

please check PR let me know if you required any changes

gpatchikoru avatar Oct 12 '24 06:10 gpatchikoru

@gpatchikoru I'm on it now

Johnkat-Mj avatar Oct 12 '24 07:10 Johnkat-Mj