Complete n00b who wants to use Instructure UI

[dave11]

Hi All,

I'd love to try my hand at using React.js and the Instructure UI but when I follow the instructions on the Quick Start guide everything goes as planned until I try to 'npm start'.

Can someone talk me through the entire process for this?

Do I need to install something beforehand?

It's been quite a few years since I've done something like this so I may be doing it all wrong!

Regards

Dave

[dave11]

Hi All,

I'd love to try my hand at using React.js and the Instructure UI but when I follow the instructions on the Quick Start guide everything goes as planned until I try to 'npm start'.

Can someone talk me through the entire process for this?

Do I need to install something beforehand?

It's been quite a few years since I've done something like this so I may be doing it all wrong!

Regards

Dave

[matthew_buckett]

I'm understanding you're following the instructions on: https://instructure.design/#usage

When you run `npm start` do you get an error message? If so what was it.

Did all the previous steps complete ok?

[dave_bull]

Morning Matthew,

This is what I get after I run npm install:

npm ERR! code ENOENT
npm ERR! syscall spawn git
npm ERR! path git
npm ERR! errno -4058
npm ERR! enoent Error while executing:
npm ERR! enoent undefined ls-remote -h -t ssh://git@github.com/CompuIves/humps.git
npm ERR! enoent
npm ERR! enoent
npm ERR! enoent spawn git ENOENT
npm ERR! enoent This is related to npm not being able to find a file.
npm ERR! enoent

npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\dave\AppData\Roaming\npm-cache\_logs\2021-02-08T08_54_15_380Z-debug.log

and when I run npm start:

> MyInstuiApp@1.0.0 start C:\Canvas\MyInstuiApp
> ui-build --bundle --watch -p 3000

'ui-build' is not recognized as an internal or external command,
operable program or batch file.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! MyInstuiApp@1.0.0 start: `ui-build --bundle --watch -p 3000`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the MyInstuiApp@1.0.0 start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm WARN Local package.json exists, but node_modules missing, did you mean to install?

npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\dave\AppData\Roaming\npm-cache\_logs\2021-02-08T08_55_18_552Z-debug.log

I can do an install of react.js as usual in the same location?

I'm sure I'm doing something wrong!

But thank you for replying 🙂

Dave

[matthew_buckett]

Ok, I'm not 100% sure what's going wrong here, but it looks like it can't find the `git` command line tool when running `npm install`. Installing `git` will help resolve that issue.

If the `npm install` doesn't complete successfully then I wouldn't expect the `npm run start` to work as dependencies needed won't be installed.

We did have a developer successfully working in Windows, but I think he had to edit some files to get things working, in the end we switched to using https://create-react-app.dev/ as our quickstarter and then just added the Instructure UI dependencies to that.

However I should say that running on Windows doesn't seem as well supported as Linux/Mac. If you stick with the Instructure UI starter you may be better off doing development in Windows Subsystems for Linux (WSL), although this may just be another rabbit hole.

[dave_bull]

Hi Matthew,

Thank you so much for your response, I'll install git and give it another go...

I've just got a Mac from work so I'll see if I can get it all up and running on that machine.

Thanks again

Dave

[dave_bull]

Hi Again,

I've never used Git before, where would I need to install it?

Dave

[matthew_buckett]

`git` is a tool for managing software source code and it can work with lots of services that provide hosting for source code. One of the most popular hosting sites is GitHub and they provide some very good documentation on installing `git`:

https://github.com/git-guides/install-git

[dave_bull]

Cheers Matthew,

I think it is time I got to grips with 'Git', there is a course on LinkedIn Learning that I'll do.

Git is used quite a bit I'm guessing?

Best get to know it!

Thanks again for all your help.

Dave

[matthew_buckett]

Yeah, git is the defacto version control software these days and if you are doing any reasonable amount of software development it is worth knowing.

Have fun.