Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

🚨 Migrate the complete project to Nextjs or any other SSG framework #569

Open
saadpasta opened this issue Jan 8, 2023 · 23 comments
Open
Assignees
Labels
discussion Discuss a new idea, feature or a general topic. enhancement New feature or request P1 Priority one issue

Comments

@saadpasta
Copy link
Owner

saadpasta commented Jan 8, 2023

Summary

Currently, the complete developerFolio is being rendered client side which results in low performance and no SEO.

My plan is to move the complete project to Static Site Generation in a short move the client side to a static site.

I have NextJs in mind with ISR.

We can also move to Gatsby but I am not sure about the support currently I have built two projects next and it's lot more stable.

What's new?

We will be moving to static sites nothing would change in jsx. The API call to GitHub for GitHub issues and other things might change. This would be a pretty big change and I am not sure how we would do it without effecting our current code. We will keep building a new version of it moving one piece one by one and then when it's done we will make it live.

Motivation

First, static sites are much faster and more performant than client-side rendered applications. This is because the content is pre-rendered and served directly from the server, rather than being generated on the client side. This means that the pages will load much faster for users, which is especially important for a project like developerFolio which may be used by developers for their portfolios.

Second, static sites are more secure than client-side rendered applications. Since the content is pre-rendered, there is no risk of user input being injected into the page and potentially causing security vulnerabilities. This is an important consideration for any open-source project that may have a large user base.

Overall, moving developerFolio to a static site using Next.js would likely provide numerous benefits for both users and maintainers of the project

Additional context

I am still on verge of using Nextjs. This could be a discussion I am open to ideas as to which static site generation we should move toward and also discuss how are going to migrate.

@saadpasta saadpasta added enhancement New feature or request discussion Discuss a new idea, feature or a general topic. P1 Priority one issue labels Jan 8, 2023
@saadpasta saadpasta changed the title Move the complete project to static site . SSG 🚨 Move the complete project to Static Pages Jan 8, 2023
@saadpasta saadpasta changed the title 🚨 Move the complete project to Static Pages 🚨 Move the complete project to Nextjs or any other SSG framework Jan 8, 2023
@saiteja13427
Copy link
Contributor

I think Nextjs would be the best choice.

As we don't really have a lot of dynamic nature as in API calls and all I think the migration should be easy only if I am not wrong.

@saadpasta
Copy link
Owner Author

Yeah but I wanna do the migration step by step like maybe one component at a time. Stuff I am not sure where should we keep the nextjs code until then maybe in folder at root.

@saiteja13427
Copy link
Contributor

Yeah, a separate folder in the root with a separate project setup would be better.

@saadpasta
Copy link
Owner Author

Yep, let's do it maybe we can define how we wanna break it maybe by components.

@saadpasta saadpasta changed the title 🚨 Move the complete project to Nextjs or any other SSG framework 🚨 Migrate the complete project to Nextjs or any other SSG framework Jan 10, 2023
@saadpasta
Copy link
Owner Author

The first thing we need to do is maybe create a Nextjs empty project in the root folder with separate build and then one by one move all the components to the there and then completely move the project

@saadpasta
Copy link
Owner Author

Created a project for better tracking on this.

https://github.com/users/saadpasta/projects/1/views/1?layout=board

@saadpasta saadpasta pinned this issue Jan 11, 2023
@saadpasta
Copy link
Owner Author

@saadpasta
Copy link
Owner Author

If you wanna pick up some tasks please pick up the task from this board and comment on the issue that you would like to work on this.

https://github.com/users/saadpasta/projects/1/views/1?layout=board

A most important issue, for now, is #571 we have to setup this up as soon as possible. If anyone would like to pick this up. Please do that ASAP we need to get this get done before everyone can work on different issue 🙏 I can also help on that issue

@codewithshariq
Copy link

Will you consider using typescript for this project?

@ibrahimahmed
Copy link

A question do you want to use new project structure of nextjs 13 or the old one

@saadpasta
Copy link
Owner Author

@ibrahimahmed Let's use the latest one

@saadpasta
Copy link
Owner Author

@codewithshariq I was considering that but I ditch the idea because not a lot of people use Typescript and we don't have much to add overhead for typesafety

@GroovierHen
Copy link

GroovierHen commented Jan 13, 2023

what about Astro. If we only need Static Site I think Astro will be better.

@saadpasta
Copy link
Owner Author

@GroovierHen Would love to give a shot in my other project react-blog-github. We already have an open issue on it to migrate it to Nextjs or any other site

@roopeshsn
Copy link

Hi @saadpasta! Currently, the project uses SCSS. Can we integrate TailwindCSS along with migration to Next.js?

@saadpasta
Copy link
Owner Author

@roopeshsn I have seen tailwind used in one or two project but I feel that actually make your code a little messy but would love to give a shot

@humayunj
Copy link

Great work on the project ✨. NextJs is incredible framework specially it's incremental site generation. As the project is being migrated I strongly suggest the use of Typescript even in some parts to improve type safety and enhanced suggestions in IDE. But of course it depends on its users if it's meant for learning,JS is good to go.

@kartikcho
Copy link
Collaborator

1 on adding typescript @saadpasta
Since a lot of people use this project for learning React, if we want to shift to the latest, we should use best practices as well (even if they'll make things less beginner friendly).

@muneebahmedayub
Copy link

@ibrahimahmed @saadpasta the new project structure of nextjs is still experimental and probably would be stable in next14. Should we still use new project structure?

@saadpasta
Copy link
Owner Author

I think we can migrate to new if the latest one won't be stable

@rogigs
Copy link

rogigs commented Jan 9, 2024

@saadpasta How is the migration to NextJs going? I saw the table with the tasks, but most of them have the status "To do". Will the migration take place?

I've created a solution to this problem. I think a section with this could be good for an international portfolio. So I implemented it in my project (https://github.com/rogigs/developerFolio/commits/master/ - it's in the commits from January 9, 2024).

The big problem is that the migration will change the sections that i18n also affects. For this reason, I haven't made the effort to open a pull request yet, but I'd like to contribute to this project, so I'd like to know if the migration will take place so that I can contribute my solution

@souravpurkait360
Copy link

@saadpasta do you need any contribution in migration, I can pick a few sections if needed.
BDW NextJS is just bringing on and on with new updates. The more delay we do the more changes we might have to make. Maybe for server components.

@ripu2
Copy link

ripu2 commented Oct 2, 2024

Hey, do you need some help here

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
discussion Discuss a new idea, feature or a general topic. enhancement New feature or request P1 Priority one issue
Projects
Status: In Progress
Development

No branches or pull requests