#288 Idea: Create a Progressive Web App for Gitea

Open
opened 1 month ago by lhinderberger · 7 comments

Hey everyone! 👋

I couldn’t help noticing that a large number of issues reported on Codeberg are related to requested UI/UX changes, including frontend bugs and customizations.

I noticed that although Gitea does have an API, Gitea’s frontend still seems to be mostly server-side rendered, creating hard dependencies between frontend, backend and frontend customizations (such as we do in build-deploy-gitea). That, to me, makes the frontend development process rather hard, requiring good full-stack development skills to be able to make even moderate changes.

I think it would be beneficial for us to make development on Codeberg’s/Gitea’s frontend more approachable for developers who are specialized in modern frontend development.

Therefore, I want to propose the idea to create a standalone web-based frontend for Gitea that accesses Gitea only using the API, similar to what GitNex does for Android.

Doing so would likely speed up frontend development and lead to UI feature requests being implemented more quickly, making users happy :) Due to a simpler architecture, we also might be able to react to new front-end technologies more quickly.

Lastly, rendering our frontend client-side as a Progressive Web App might improve performance due to better caching and it might take some load off our servers.

The best thing is that this can be developed and tested without affecting our current technology stack and without requiring major changes to Gitea. Only Gitea’s API might need some extensions here and there, if we should encounter limitations.

What are your thoughts on this? And are there people who would like to participate in such a project?

I’m happy to hear your feedback, ideas and criticism! :)

Hey everyone! 👋 I couldn't help noticing that a large number of issues reported on Codeberg are related to requested UI/UX changes, including frontend bugs and customizations. I noticed that although Gitea does have an API, Gitea's frontend still seems to be mostly server-side rendered, creating hard dependencies between frontend, backend and frontend customizations (such as we do in build-deploy-gitea). That, to me, makes the frontend development process rather hard, requiring good full-stack development skills to be able to make even moderate changes. I think it would be beneficial for us to make development on Codeberg's/Gitea's frontend more approachable for developers who are specialized in modern frontend development. Therefore, I want to propose the idea to create a standalone web-based frontend for Gitea that accesses Gitea only using the API, similar to what GitNex does for Android. Doing so would likely speed up frontend development and lead to UI feature requests being implemented more quickly, making users happy :) Due to a simpler architecture, we also might be able to react to new front-end technologies more quickly. Lastly, rendering our frontend client-side as a Progressive Web App might improve performance due to better caching and it might take some load off our servers. The best thing is that this can be developed and tested without affecting our current technology stack and without requiring major changes to Gitea. Only Gitea's API might need some extensions here and there, if we should encounter limitations. What are your thoughts on this? And are there people who would like to participate in such a project? I'm happy to hear your feedback, ideas and criticism! :)
lhinderberger added the
question
label 1 month ago
6543 commented 1 month ago
Collaborator

In my opinion: I like the current way UI things are handled,

But I’m happy to help out with API stuff just @ping to me

And having Alternative UI’s is nice, so user’s can then decide what to use

In my opinion: I like the current way UI things are handled, But I'm happy to help out with API stuff just @ping to me And having Alternative UI's is nice, so user's can then decide what to use
vanous commented 1 month ago

Related gitea issues:

https://github.com/go-gitea/gitea/issues/8174

https://github.com/go-gitea/gitea/issues/5937

With all the great work being done on GitNex, it is sad we cannot reuse that...

Related gitea issues: https://github.com/go-gitea/gitea/issues/8174 https://github.com/go-gitea/gitea/issues/5937 With all the great work being done on GitNex, it is sad we cannot reuse that...
lhinderberger commented 1 month ago
Poster

Thanks for sharing the links!

Seeing that the Gitea developers seem to prefer Vue.js, it might be wise to use that as the base for the (hypothetical, at this point) progressive web app, to enable code to be shared, where possible.

Also, Vue.js 3.0 has just been released 🎉

Thanks for sharing the links! Seeing that the Gitea developers seem to prefer Vue.js, it might be wise to use that as the base for the (hypothetical, at this point) progressive web app, to enable code to be shared, where possible. <sub>Also, Vue.js 3.0 has just been released 🎉</sub>
lhinderberger commented 1 month ago
Poster

With all the great work being done on GitNex, it is sad we cannot reuse that...

While it indeed might be hard to reuse code due to the different technology stacks, we can certainly share knowledge, I think :)

> With all the great work being done on GitNex, it is sad we cannot reuse that... While it indeed might be hard to reuse code due to the different technology stacks, we can certainly share knowledge, I think :)

https://github.com/unfoldingWord/gitea-react-toolkit may be what you are looking for, it is a component library to build custom interfaces on top of gitea.

https://github.com/unfoldingWord/gitea-react-toolkit may be what you are looking for, it is a component library to build custom interfaces on top of gitea.

This is a big project, I’d like to take a stab at it from scratch to improve my frontend skills. Most likely I’ll start a PWA git client based on vue 3 soon. Those react components are a good resource, but it uses axios and react. Axios can be replaced with the browser native fetch api directly (I don’t like bloat). I’ve worked with react before and I also like Vue a bit better so far.

This is a big project, I'd like to take a stab at it from scratch to improve my frontend skills. Most likely I'll start a PWA git client based on vue 3 soon. Those react components are a good resource, but it uses axios and react. Axios can be replaced with the browser native fetch api directly (I don't like bloat). I've worked with react before and I also like Vue a bit better so far.
lhinderberger commented 3 weeks ago
Poster

Most likely I’ll start a PWA git client based on vue 3 soon.

That is magnificent! If you need a helping hand that knows his way around Vue, let me know :)

> Most likely I'll start a PWA git client based on vue 3 soon. That is magnificent! If you need a helping hand that knows his way around Vue, let me know :)
Sign in to join this conversation.
No Milestone
No Assignees
5 Participants
Notifications
Due Date

No due date set.

Dependencies

This issue currently doesn't have any dependencies.

Loading…
There is no content yet.