Consider using React for V2 #68
Replies: 19 comments 30 replies
-
Looking for Mani, Matt, and Jeff to join and have a planning discussion about a new development platform, what needs to be rewritten, and which new feature to begin with for the next version. - Fred |
Beta Was this translation helpful? Give feedback.
-
We had an ongoing discussion in issue 57. Should we continue it here or just add to that and make future discussions here? #57 (comment) |
Beta Was this translation helpful? Give feedback.
-
Are you still with us @murfett-au ? I think we are ready to go with React |
Beta Was this translation helpful? Give feedback.
-
There are a few decisions we have to make before we start writing:
|
Beta Was this translation helpful? Give feedback.
-
Let me start with what we need, which may dictate the tools used. Here is what makes EX-WebThrottle (we are standardizing to EX as the prefix for everything):
Maybe the first option to decide is the node.js server. What is involved for A. Us and B. The user? It is a "server" running on the user's machine? It doesn't have to run on a server we maintain? Or does it? Would there be anything the user would have to install or deal with in some way? We need this to be for Conductors, they should only have to learn the throttle controls, not have to worry about dependencies versions of other things they have to have on their computer. Fred |
Beta Was this translation helpful? Give feedback.
-
I understand the price to pay for using modern tool is a build. The CS needs to be compiled and built, as does the web page. But how easy is it? I do love the tools in the browser to be able to actually debug things with React. |
Beta Was this translation helpful? Give feedback.
-
So after installing all these things, what does the development process look like? You code in VSC, then hit the build button which invokes the typescript compiler? And this puts code in a subfolder of the project folder? And how does it work for users at runtime? Now, we just have all the files on github here: https://dcc-ex.github.io/WebThrottle-EX where all the files are just placed in a folder and it runs from there. Or, you can just copy those files locally and it works with no internet connection. What will be different with this system? Will we have to install a node.js runtime for the user? What would be the point of writing it to run in a browser if you still need something external to run it? From one of our developers when we were talking about using websockets, which is NOT supported on the Command Station: "But to implement websockets just to support a throttle that needs that because it happens to run in a browser is why oh why? We don't have websockets because we code to the AT command set of the ESP devices and use their network firmware handle the connection. We also may not have the RAM in the Arduino to support writing websocket code. I don't know if the AT firmware on the ESP8266 can handle websockets. So EX-WebThrottle would have to work the same way the phone throttles work if we have a WiFi path. |
Beta Was this translation helpful? Give feedback.
-
Hi I am Dex and I have started to remake the project in Vue already Vue3 specifically. The learning curve for Vue I feel is easier and better suited for anyone wanting to dip their toes into helping us. I can convert current code to composition API to help facilitate this as well. |
Beta Was this translation helpful? Give feedback.
-
I'll give addressing some of this a go: HostingAs far as I know, both Vue and React can be compiled to a single HTML, js and CSS file. This means we can continue to host on GitHub Pages like we currently do, no installing anything for the user. Obviously with this solution theres no backend to run code on but with webserial this isn't really a problem. Also a WiThrottle client may be possible without a backend. NodeNode would only be required for developers and is relatively easy to set up, I could write a wiki page detailing how to get started for new developers once everything is set up. In short, all that needs to be done is to install Node then run CSSI can see that SCSS could be quite powerful, but I'd like to point out that tailwind definitly does work with Vue/React, see this page here: After following this guide for vue I have it set up to generate the needed tailwind classes every time the vue reloads, as part of the vue build process. I'm not saying it's the best solution in every situation, but I've been doing a fairly large project with Vue and Tailwind and really liked it. There is a VSCode extension which is good and I like keeping all the stying in one place. It also is easy to conditionally style elements like this: <h1
:class="hidden ? 'hidden' : 'block'"
>
Some text
</h1> Where hidden is a boolean variable in the typescript. VSCodeVSCode works really well with typescript and vue, and I'm sure it does with React as well. When everything is decided upon I can set up a workspace that we can all open in VSCode with shared settings etc. You can also set up recommended extensions with VSCode workspaces which would help new developers join the project. New repoI personally think that a new repo would be best as it will allow for a fresh start. Some of the other benefits would be allowing us to continue offering the current website whilst the new one is in beta and I could add a banner to this one notifiying people of the new version. This would also allow us to rebrand easier without breaking links etc as the repo name is part of the URL to access the site. React Vs VueI wouldn't mind if React is chosen but from what I've heard they are fairly similar. Vue is basically just combining the js, HTML and css into one file but in distinct sections. Either way both are fairly common so finding new developers shouldn't be too hard. As for why I chose Vue instead of React to learn, it was simply just principles as I didn't like that React was made my Meta that's all! Formatting and consistencyFor the new version if we are using something node based (which looks probable) I'd quite like to introduce eslint with some formatting rules such as one quote style and hopefully we can agree on a tab size! I seem to remember this was a bit of a problem before with a mismatch of indents on different files I realise this is quite a bit to read but hopefully this should help clear up some of the questions in this thread. If anyone still questions (or more likely new ones!) please don't hesitate to ask |
Beta Was this translation helpful? Give feedback.
-
upon decide on the tech, Use the basic layout to start with. |
Beta Was this translation helpful? Give feedback.
-
@cjmayo Chris, do you have any input. @hansSchall and @murfett-au also. As I mentioned, I know very little a out any of these tools because I don't do web development, but I am learning about Vue and React. At this point, we are leaning towards Vue because we want to have development continue 2 years from now and need people on the team who know how to maintain the code. |
Beta Was this translation helpful? Give feedback.
-
@cjmayo , @murfett-au , @matt-hu, @matt-vdv We really want to push this project forward and need help. Who can work with me to take over the programming and get the next version finished? |
Beta Was this translation helpful? Give feedback.
-
Sorry, but @matt-hu (me) is not the intended recipient, and someone is missing out on this thread.
-------- Original message --------From: Fred ***@***.***> Date: 11/24/23 2:54 PM (GMT-08:00) To: DCC-EX/WebThrottle-EX ***@***.***> Cc: Matt Humiston ***@***.***>, Mention ***@***.***> Subject: Re: [DCC-EX/WebThrottle-EX] Consider using React for V2 (Discussion #68)
@cjmayo , @murfett-au , @matt-hu, @matt-vdv We really want to push this project forward and need help. Who can work with me to take over the programming and get the next version finished?
—Reply to this email directly, view it on GitHub, or unsubscribe.You are receiving this because you were mentioned.Message ID: ***@***.***>
|
Beta Was this translation helpful? Give feedback.
-
@hansSchall are you still with us and available to help? |
Beta Was this translation helpful? Give feedback.
-
We have some independent projects going in different directions. It would be easiest (I believe) to have our development discussions on our Discord. So far, most of us are there. @hansSchall are you there as well? @cjmayo, et all? If not, would you be willing? I believe the 3 projects that have already gotten pretty far along are @matt-vdv project and @dcyoung-dev and @dexslab. If we can all move to Discord, that would be best, but I can try to pick one of the threads here on GitHub to coordinate this if we need to. We have 2 or more discussion threads and it is hard to know where we are talking about what. Since there are existing projects, I am hoping we can put aside our feelings of attachment to a particular bit of code and vote on the best of the approaches and move it forward together. I am trying to go through all the messages in all the threads and come up with a document that distills it to something manageable in blocks of tasks. We need to look at Matt and Chris and Anthony's projects and see what we can advance from that. |
Beta Was this translation helpful? Give feedback.
-
Can I be removed from this thread going forward. Thanks, and best of luck with your project!
-------- Original message --------From: Fred ***@***.***> Date: 12/1/23 11:42 AM (GMT-08:00) To: DCC-EX/WebThrottle-EX ***@***.***> Cc: Matt Humiston ***@***.***>, Mention ***@***.***> Subject: Re: [DCC-EX/WebThrottle-EX] Consider using React for V2 (Discussion #68)
We have some independent projects going in different directions. It would be easiest (I believe) to have our development discussions on our Discord. So far, most of us are there. @hansSchall are you there as well? @cjmayo, et all? If not, would you be willing? I believe the 3 projects that have already gotten pretty far along are @matt-vdv project and @dcyoung-dev and @dexslab. If we can all move to Discord, that would be best, but I can try to pick one of the threads here on GitHub to coordinate this if we need to. We have 2 or more discussion threads and it is hard to know where we are talking about what. Since there are existing projects, I am hoping we can put aside our feelings of attachment to a particular bit of code and vote on the best of the approaches and move it forward together. I am trying to go through all the messages in all the threads and come up with a document that distills it to something manageable in blocks of tasks. We need to look at Matt and Chris and Anthony's projects and see what we can advance from that.
It might be good to have a video call and each person presents their project so we can all get up to speed. If you read this and, I think #65? There are a ton of questions we need the answers to like Vue or React or Electron, and Webserial or Websockets, etc., etc. I am hoping we can narrow this down quickly. We can also get input from the rest of the team on Discord. While they won't code this project, there is a lot of value in their ideas of how to integrate it into the EX-CS and handle the IP issues.
—Reply to this email directly, view it on GitHub, or unsubscribe.You are receiving this because you were mentioned.Message ID: ***@***.***>
|
Beta Was this translation helpful? Give feedback.
-
I am hoping that if we don't specifically mention matt-hu that he won't be included in this anymore, or when we create a different issue, he is not bothered. I know he can "unsubscribe" to something in the right sidebar, but not sure we have an explicit way to remove him. If he is included in something that I can remove him from, let me know |
Beta Was this translation helpful? Give feedback.
-
the intended Matt is on this thread but informed us that he changed his
GitHub username a few months ago at the same time i signed up for GitHub to
collarabe on a Bible project :)
…On Wed, Dec 6, 2023 at 8:35 AM Fred ***@***.***> wrote:
I am hoping that if we don't specifically mention matt-hu that he won't be
included in this anymore, or when we create a different issue, he is not
bothered. I know he can "unsubscribe" to something in the right sidebar,
but not sure we have an explicit way to remove him. If he is included in
something that I can remove him from, let me know
—
Reply to this email directly, view it on GitHub
<#68 (comment)>,
or unsubscribe
<https://github.com/notifications/unsubscribe-auth/BBUKM4OFGAEI2PX6QWHXLPDYICNDLAVCNFSM5FJ5UV52U5DIOJSWCZC7NNSXTOKENFZWG5LTONUW63SDN5WW2ZLOOQ5TONZXHA2TAMQ>
.
You are receiving this because you were mentioned.Message ID:
***@***.***>
|
Beta Was this translation helpful? Give feedback.
-
@hansSchall I do not see that name on Discord. The last person with "hans" in their name joined 5 months ago. Perhaps you joined Discord, but have not yet joined our channel. Click this link to join https://discord.gg/y2sB4Fp |
Beta Was this translation helpful? Give feedback.
-
I’ve just started using DCC++ and (for work) I write React Java script code. I think it would make development of DCC++ much easier, but only if the key people know what it is and would consider using it.
I would be happy to knock up a prototype.
Beta Was this translation helpful? Give feedback.
All reactions