Windows support

[pablococeres]

Hi again Sam, I tried to replicate the todolist app and when I add it to settings I receive this error

File "~\AppData\Local\Programs\Python\Python310\lib\subprocess.py", line 966, in init
self._execute_child(args, executable, preexec_fn, close_fds, File "~\AppData\Local\Programs\Python\Python310\lib\subprocess.py", line 1435, in _execute_child hp, ht, pid, tid = _winapi.CreateProcess(executable, args, FileNotFoundError: [WinError 2] El sistema no puede encontrar el archivo especificado

The file is there, what I found searching is that I have to modify shell=False to shell=True But Im not sure where or why so maybe you know the cause. Again something with windows I think

[samwillis]

Hmm, I think it's time for me to setup and Windows VM and do some debugging, may be a few days until I'm able to get to it.

I think you may be right, from memory (it's a long time since I did anything with subprocess on Windows) there was something about setting shell=True...

If you want to have a go yourself the relevant lines are:

https://github.com/samwillis/tetra/blob/9d5ab31cabc563d3ad11ff8d4f591080dd7e4260/tetra/library.py#L139-L143

and:

https://github.com/samwillis/tetra/blob/9d5ab31cabc563d3ad11ff8d4f591080dd7e4260/tetra/library.py#L187-L200

Docs here: https://docs.python.org/3/library/subprocess.html#subprocess.run

[PatrickSchutte]

Good morning Sam, Thank you for your efforts, I am also having a look at this, and using your example code. It seems like TETRA_ESBUILD_PATH has be set in the settings including the "esbuild.cmd" script file (I have just used the raw windows path in my testing).

It also does not seem to like the . in the statement in the components.py library. (from .models import ToDo)

[samwillis]

I think I have windows support working. Two things needed changing:

• esbuild needed to be executed from it's node_modules/.bin/esbuild.cmd variant, rather than node_modules/.bin/esbuild. (thanks @PatrickSchutte)

• and Tetra (on windows) was outputting windows style backslash paths for css/js import statements rather than url style forward slashes.

Both fixed and it's working for me.

If you would like to test it, you can install the version from the GitHub main branch with:

pip install https://github.com/samwillis/tetra/archive/refs/heads/main.zip

[PatrickSchutte]

Thank you @samwillis , it seems to be working perfectly now.

I had to put back the full-stop in the components.py library. (from .models import ToDo) as the building/registering process fails silently, and you get a ComponentNotFound error.

[pablococeres]

Hi Sam, I uninstall and install your the last version and the error still there. File "C:\Users\pablo\AppData\Local\Programs\Python\Python310\lib\subprocess.py", line 1435, in _execute_child hp, ht, pid, tid = _winapi.CreateProcess(executable, args, FileNotFoundError: [WinError 2] El sistema no puede encontrar el archivo especificado

[samwillis]

@PatrickSchutte Brilliant, let me know how you get on with Tetra.

@pablococeres Could you confirm you have installed esbuild and that your node_modules directory is in the root of the Django project? It seems odd that it's not seeing the file. May be worth trying to set the TETRA_ESBUILD_PATH settings to the exact path to esbuild.cmd.

[PatrickSchutte]

Hi Sam, I have been experimenting more with Tetra.

My structure is:

• st
• • components
• • • init.py (with the double underscores but messes with the formatting)
• • • courses.py

init.py contains:
from .courses import courses

and courses.py contains:

from tetra import Library, Component

from st.models import Learner

courses = Library()


@courses.register
class LearnerComponent(Component):
    learner_number = ''
    surname = ''
    first_names = ''
    learner: Learner

    def load(self) -> None:
        self.learner = Learner()

If I run the below command at the console, all is built fine. python manage.py tetrabuild

if I however runserver, the library is added to the global libraries, but the component is not built. I assume that I'm not setting it up correctly and will re-read the multiple components section again.

Regards Patrick

[PatrickSchutte]

Hi Sam, I have been experimenting more with Tetra.

My structure is:

* st

* * components

* * * init.py (with the double underscores but messes with the formatting)

* * * courses.py

init.py contains: from .courses import courses

and courses.py contains:

from tetra import Library, Component

from st.models import Learner

courses = Library()


@courses.register
class LearnerComponent(Component):
    learner_number = ''
    surname = ''
    first_names = ''
    learner: Learner

    def load(self) -> None:
        self.learner = Learner()

If I run the below command at the console, all is built fine. python manage.py tetrabuild

if I however runserver, the library is added to the global libraries, but the component is not built. I assume that I'm not setting it up correctly and will re-read the multiple components section again.

Regards Patrick

Sorted, tetra must also be before any of your apps in the settings.INSTALLED_APPS list.

[samwillis]

@PatrickSchutte

Brilliant, thanks, I will document that.

[samwillis]

@pablococeres

I'm not sure what's wrong with your installation. Did you have any more luck? If you could post a full stack trace that would be helpful.

I'm planning on bundling esbuild with Tetra, I hope to get on to that soon as it will mitigate these installation problems.

[olu-damilare]

Hi @samwillis, please what is the correct URL to access the app? I followed the doc and built the todo app, then tried accessing it through http://localhost:8000/tetra/ but I keep getting the 404 error. Is there something I'm missing?

[PatrickSchutte]

Hi @samwillis, please what is the correct URL to access the app? I followed the doc and built the todo app, then tried accessing it through http://localhost:8000/tetra/ but I keep getting the 404 error. Is there something I'm missing?

Hi @olu-damilare, You would need to create an entry into your views.py, as well as urls.py so that you can render the index.html.

[olu-damilare]

Hi @samwillis, please what is the correct URL to access the app? I followed the doc and built the todo app, then tried accessing it through http://localhost:8000/tetra/ but I keep getting the 404 error. Is there something I'm missing?

Hi @olu-damilare, You would need to create an entry into your views.py, as well as urls.py so that you can render the index.html.

Thank you @PatrickSchutte. Just out of curiosity, is this the expected output for the todo app from the code? I'm asking because it's kind of different from what is on the webpage and I was wondering if I implemented it wrongly.

[PatrickSchutte]

Excellent!, It is basically there, just the icons is missing. I assume that the code below will give you your icons. The rest is basically just the css styling.

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/css/all.min.css" integrity="sha512-KfkfwYDsLkIlwQp6LFnl8zNdLGxu9YAA1QvwINks4PhcElQSvqcyVLLD9aMhXd13uQjoXtEKNosOWaZqXgel0g==" crossorigin="anonymous" referrerpolicy="no-referrer" />

[samwillis]

Thanks Patrick for helping! This has highlighted I should update the walkthrough to cover those missing bits…

[olu-damilare]

Hello @samwillis, I'm currently writing a blog post on how to build a full-stack app with Tetra. I've been struggling to put it together for over a week now and could really use your input and help.

[olu-damilare]

@samwillis I got this error cryptography.fernet.InvalidToken when I tested the todo app I built again. What could be the cause? The app was working fine but suddenly began throwing this error when I clicked on the 'Add' button.

[samwillis]

Hi @olu-damilare,

Thats an interesting one, could you send me your code. That can happen if you cleared your cache, deleted your session cookie, changed the Django SECRET_KEY or the users session what ended for any other reason. Had anything else changed in the environment or code?

[olu-damilare]

@samwillis How does Tetra handle file upload? The django server is not receiving the file from the Tetra component. Also, the doc does not contain any use case or walk through as to how to go about this.