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 website to Gatsby #109

Open
alexdor opened this issue Feb 25, 2019 · 31 comments
Open

Migrate website to Gatsby #109

alexdor opened this issue Feb 25, 2019 · 31 comments
Assignees
Labels
enhancement New feature or request help wanted Extra attention is needed

Comments

@alexdor
Copy link
Member

alexdor commented Feb 25, 2019

Migrating this project to Gatsby will decrease the time-to-interactive for the users and improve site's seo

@alexdor alexdor added enhancement New feature or request help wanted Extra attention is needed labels Feb 25, 2019
@siddhant1
Copy link
Collaborator

Looks amazing to me. Will start working on this soon

@siddhant1
Copy link
Collaborator

Should we do it in typescript only?

@alexdor
Copy link
Member Author

alexdor commented Feb 25, 2019

@siddhant1 I'm not sure what do you mean with the question about typescript.

@ashu8912
Copy link
Collaborator

By doing it in typescript he means that instead of writing codes in js way for gatsby we will be doing it in ts files and the "ts way"

earlier =>"React with Ts"
enhancement =>"gatsby with TS"

@ashu8912
Copy link
Collaborator

I also want to work upon this one coz i am into gatsby these days so it would be kind of a benefit for me

@alexdor
Copy link
Member Author

alexdor commented Feb 26, 2019

Yeah ideally it would be in typescript so we can leverage the existing code (and the benefits of ts). There is a gatsby plugin for ts here https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-plugin-typescript

@siddhant1
Copy link
Collaborator

Cool , let's start with moving the routes !

@ashu8912
Copy link
Collaborator

How do we start the gatsby transformation... doing it on this repo will break the already present code
and as this repo uses netlifies continuous deployment feature
The broken website will lead to problems to the already user of the website
--------Things we can do ---------
1.we can stop the continuous deployment feature for a specific amout of time till our gatsby transformation is done
2.Or creating a new Repo and doing everything there and at the end making live the new Enhanced Website

If there is any other option plzz tell

@alexdor
Copy link
Member Author

alexdor commented Feb 27, 2019

I think that the best way is to start a branch here and collaborate on that branch, so we can have the previews that netlify produces and have a single point of tracking progress. What do you think?

@ashu8912
Copy link
Collaborator

yeah thats the best thing we can do

@siddhant1
Copy link
Collaborator

I will make my first pr on this today or maybe tomorrow , I think we can build over that

@alexdor
Copy link
Member Author

alexdor commented Feb 27, 2019

@siddhant1 and @ashu8912 you should both have access to write to this repo, so create a branch here.

Note: The master branch is locked so in order to get smth into the master branch we need to make a pr

@ashu8912
Copy link
Collaborator

will soon create branch "fixme-enhancement-gatsby" or should i name it something else???
also will update docs to tell how to contribute to this branch.........

@alexdor
Copy link
Member Author

alexdor commented Feb 27, 2019

I don't mind the name, feel free to choose : )

@ashu8912
Copy link
Collaborator

ok thanks :)

@ashu8912
Copy link
Collaborator

@siddhant1 and @ashu8912 you should both have access to write to this repo, so create a branch here.

Note: The master branch is locked so in order to get smth into the master branch we need to make a pr

@alexdor I don't have rights to write to this repo didn't received any enail
send request to collaborate......
:)

@ashu8912
Copy link
Collaborator

I think that the best way is to start a branch here and collaborate on that branch, so we can have the previews that netlify produces and have a single point of tracking progress. What do you think?

https://stackoverflow.com/questions/1384325/in-git-is-there-a-simple-way-of-introducing-an-unrelated-branch-to-a-repository

we will be creating an orphan branch for this gatsby transformation it will be a fresh branch(meaning no ancestors) . And when the project is finally transformed to gatsby we will be removing the master
branch content and merging this branch to an empty master

---Or--- we can copy the content of the master branch to some other repo specifying the old code is
here....

Now one thing more as i see for this fixme repo the continuous development feature of netlify
only looks for the master branch
we can make use of another cool feature of netlify i.e., "Branch deploy" with this we get netlify
previews for branches that are specified on netlify..

@alexdor plzz show your views on this...

@alexdor
Copy link
Member Author

alexdor commented Feb 28, 2019

I don't see the reason of starting on orphan branch. A lot of the existing codebase will be reused, it is just a tooling change. Why do you want to create an orphan branch?

Note: @ashu8912 I've send you an email yesterday with the link to accept the invitation let me know if you didn't get it

@ashu8912
Copy link
Collaborator

i thought that starting from orphan and than bootstrapping the code with gatsby cli would be a great idea . coz if master is an ancestor to this newly created branch than we will have the old code also in our branch....
------------"problem(not actually just a lot of refactoring)"--------
like gatsby cli will generate a src folder and than we already have a src folder so lot of deletion and updation will take place while doing this.........
------------------------Two Options-----------
1.start on an orphan branch bootstrap with gatsby cli and we still can use the old code wherever we want
2.Use the old code and on new branch Don't use the gatsby cli...........manage gatsby dependency all by ourselves

Both options can be done......
@alexdor

@alexdor
Copy link
Member Author

alexdor commented Feb 28, 2019

My recommendation would be to do the following:

  • Generate a new project with Gatsby's cli there are a few starter kits with ts here: https://www.gatsbyjs.org/starters?c=TypeScript&v=2 on a folder in your computer
  • Create a new local branch in this repo
  • Bring the structure and the changes from Gatsby's generated folder into this repo and merge the package.json folder
  • Test the new changes

But feel free to implement it another way if you think you can find a better one.

@ashu8912
Copy link
Collaborator

ok that would be great :)

@ashu8912 ashu8912 self-assigned this Mar 1, 2019
@Muljayan
Copy link
Contributor

Muljayan commented Mar 3, 2019

@alexdor what do you think of next js ? It can help with SEO too.

@alexdor
Copy link
Member Author

alexdor commented Mar 3, 2019

@Muljayan why do you think that it would be more beneficial to switch to nextjs instead of gatsby?

@Muljayan
Copy link
Contributor

Muljayan commented Mar 4, 2019

Honestly, I am not familiar with Gatsby, but I am aware that with next.js the head tag, meta tags can be dynamically changed to optimize it for search engines.

@siddhant1
Copy link
Collaborator

siddhant1 commented Mar 4, 2019 via email

@siddhant1 siddhant1 assigned siddhant1 and unassigned ashu8912 Mar 4, 2019
@alexdor
Copy link
Member Author

alexdor commented Mar 4, 2019

Yeah, as @siddhant1 mentioned this project already sets dynamic meta tags (you could also do that with plain js). The main improvement regarding seo is going to be the prerendered pages. Prerendered pages will dicrease the time-to-interactive and will allow the crawlers to parse the website better.

Both nextjs and gatsby support prerendering pages (nextjs also supports rendering pages per request based, but we don't need that feature because we don't have so much dynamic content so it wouldn't justify the extra server required to render pages per request). So both technologies are a good candidate.

The reason why I suggested gatsby over nextjs is that gatsby has more tooling regarding content sources and because it is more oriented towards static page generation than nextjs. Though I might be wrong, so feel free to convince me otherwise if you think that nextjs is better for this use case :)

@Muljayan
Copy link
Contributor

Muljayan commented Mar 5, 2019

I agree. Since the majority of the site would be static Gatsby would be a good fit.

@himankpathak
Copy link
Contributor

Hi @ashu8912, what's the status? Are you still working on this issue?

@siddhant1
Copy link
Collaborator

Hey @himankpathak I am working on this , I have some changes ready in my branch (breaking though) , I will.be pushing this one soon

@nik72619c nik72619c added the in progress The task is currently in progress and is assigned label Mar 5, 2019
@siddhant1 siddhant1 removed the in progress The task is currently in progress and is assigned label Mar 8, 2019
@alexdor
Copy link
Member Author

alexdor commented Mar 20, 2019

@ashu8912 @siddhant1 hi : ) what's the status of this?

@siddhant1
Copy link
Collaborator

Basic scaffold is ready , extending now

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request help wanted Extra attention is needed
Projects
None yet
Development

No branches or pull requests

6 participants