Good First Issues

[Isaac-Flath]

Good First Issues

If you are looking to contribute, pick something here! You should create a small fully self-contained app that demonstrates the concept.

It should show the concept in as minimal way as possible. Do not add styling and other elements that do not help illustrate the concept (even if they make something look prettier). Keep the code concise and add comments to explain core concepts if you thing it would help a reader. But you do not need comments if something seems like it would be straightforward from reading the code.

If you need additional styling than pico css, use fh-frankenui. But only do that if you really need it to prevent from distracting from the core concept.

HTMX

Note: Check to see if an example is already in the examples repo. If it is, just adapt and migrate it!

• Click To Edit Demonstrates inline editing of a data object
• @SSC-SDE Bulk Update Demonstrates bulk updating of multiple rows of data
• @CarloLepelaars Click To Load Demonstrates clicking to load more rows in a table
• @ihasidul Delete Row Demonstrates row deletion in a table
• @WillToro94 Edit Row Demonstrates how to edit rows in a table
• Lazy Loading Demonstrates how to lazy load content
• Inline Validation Demonstrates how to do inline field validation
• Infinite Scroll Demonstrates infinite scrolling of a page
• Active Search Demonstrates the active search box pattern
• Progress Bar Demonstrates a job-runner like progress bar
• Value Select Demonstrates making the values of a select dependent on another select
• @CarloLepelaars Animations Demonstrates various animation techniques
• File Upload Demonstrates how to upload a file via ajax with a progress bar
• Preserving File Inputs after Form Errors Demonstrates how to preserve file inputs after form errors
• Dialogs - UIKit Demonstrates modal dialogs using UIKit
• Tabs (Using HATEOAS) Demonstrates how to display and select tabs using HATEOAS principles
• Tabs (Using JavaScript) Demonstrates how to display and select tabs using JavaScript
• @adnaaaen Keyboard Shortcuts Demonstrates how to create keyboard shortcuts for htmx enabled elements
• Drag & Drop / Sortable Demonstrates how to use htmx with the Sortable.js plugin to implement drag-and-drop reordering
• @audreyfeldroy Updating Other Content Demonstrates how to update content beyond just the target elements
• Confirm Demonstrates how to implement a custom confirmation dialog with htmx
• Web Components Demonstrates how to integrate htmx with web components and shadow DOM

Other

• Cards
• @bojasabara Carousels
• Contact Form
• Hamburger menu
• Alternating color block sections
• Hover Effects
• Surreal functions in 02_extend or examples in examples(https://github.com/AnswerDotAI/fasthtml-example/tree/main/htmx)

[mohamedo396]

Hi ,

I came across your post about the "Good First Issues" for HTMX examples, and I’m very interested in contributing to this project. I appreciate how well-defined and beginner-friendly these tasks are, and I’d love to help create an example.

I’m particularly interested in working on the file upload example. If this issue is still open, could you please assign it to me? I’ll ensure that the implementation is minimal, clear, and adheres to your guidelines.

Let me know if you need any additional information from me before I start. Looking forward to your response!

[Isaac-Flath]

Great - Thank you @mohamedo396 ! Please let me know if you get stuck, have questions, or would like opinions along the way. I'm happy to help out anywhere you need!

I've create an issue we can chat about this as needed :). #50

[mohamedo396]

thank you very much

[madnancp]

Hello,
I’m interested in this issue: "Keyboard Shortcuts"
If it’s still open, I’d love to take it on as my first contribution. Please assign it to me.

Thank you!

[Isaac-Flath]

Great thanks @adnaaaen

[WillToro94]

Hi there,

I'm a student taking an Open-Source Development class and I'm eager to contribute to the project. I'm particularly interested in the "Edit Row" issue if it's still available.

Also if possible could you please let me know if there are any other beginner-friendly issues I could work on if the "Edit Row's not available.

[Isaac-Flath]

Great - Thanks @WillToro94 . All yours! if you have questions or need help, feel free to open a separate issue and @ me in that.

[ihasidul]

Hey there, Although I am new to htmx and FastHTML I want to try out the "Delete Row Demonstrates row deletion in a table" task. Should I start working on the task or create a new issue? @Isaac-Flath

[Isaac-Flath]

@ihasidul Go ahead and start working on the task. If you have questions or need help, please open an issue at that time and we can work through anything there :).

Thanks a bunch!

[bojasabara]

Hi ,

I came across your post about the "Good First Issues" for HTMX examples, and I’m very interested in contributing to this project. I appreciate how well-defined and beginner-friendly these tasks are, and I’d love to help create an example.

I’m particularly interested in working on the file Carousels example. If this issue is still open, could you please assign it to me? I’ll ensure that the implementation is minimal, clear, and adheres to your guidelines.

Let me know if you need any additional information from me before I start. Looking forward to your response!

[Isaac-Flath]

@bojasabara Sounds great!

Sliders were just added to Monsterui yesterday in case it's helpful to you and is what you had in mind! Here's a link to the docs.

[SSC-SDE]

Hey @Isaac-Flath ,

I'd love to take on the 'Bulk Update' feature . I've been exploring the Good First Issues and have reviewed the existing examples linked in the descriptions, and I feel confident in contributing in the same structured manner. Could you assign this to me if available else I could try something to do with "File Upload Demonstrates how to upload a file via ajax with a progress bar".

[Isaac-Flath]

@SSC-SDE Thank you! I've assigned bulk update to you :)

[SSC-SDE]

@SSC-SDE Thank you! I've assigned bulk update to you :)

Hi made a PR on this, please let me know if this would work.

#74