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

Pass the <div id="app"> to initApp() #50

Merged
merged 1 commit into from
Dec 16, 2023
Merged

Pass the <div id="app"> to initApp() #50

merged 1 commit into from
Dec 16, 2023

Conversation

mbland
Copy link
Owner

@mbland mbland commented Dec 16, 2023

Now main.js retrieves the top level element and passes it to initApp(), which then gets passed to the other components.


While still thinking about the <form> + DocumentFragment problem, it occurred to me that not every component should need to call document.querySelector('#app'). I'm also currently expecting the <form> solution I come up with to require creating elements on the main DOM instead of a DocumentFragment.

Plus, if we ever want to change that ID, or use a class name, etc., we'd have to update every querySelector() call. This new architecture eliminates that particular problem.

Now main.js retrieves the top level element and passes it to initApp(),
which then gets passed to the other components.

---

While still thinking about the <form> + DocumentFragment problem, it
occurred to me that not every component should need to call
document.querySelector('#app'). I'm also currently expecting the <form>
solution I come up with to require creating elements on the main DOM
instead of a DocumentFragment.

Plus, if we ever want to change that ID, or use a class name, etc., we'd
have to update every querySelector() call. This new architecture
eliminates that particular problem.
@mbland mbland self-assigned this Dec 16, 2023
@mbland mbland merged commit 2d9a631 into main Dec 16, 2023
3 checks passed
@mbland mbland deleted the init-with-app-elem branch December 16, 2023 22:31
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

1 participant