virtualvivek / react-windows-ui

Build Windows native look & feel apps using ReactJS. Provides a set of accessible, reusable and composable react components that make it super easy to create websites and apps.
https://virtualvivek.github.io/react-windows-ui/
MIT License
537 stars 44 forks source link

Not able to setup the project #2

Closed rajendrasp closed 3 years ago

rajendrasp commented 3 years ago

I am trying to use the react windows ui repo.

I pulled the source and run commands mentioned in the file - npm-scripts.txt. But getting the following error when running "npm run deploy". I did not see any documentation on how to use this repo. Can you please help me?

PS C:\D\Learnings\ReactWindowsUI\VirtualVivek\src\react-windows-ui> npm run deploy

react-windows-ui-app@2.0.2 predeploy C:\D\Learnings\ReactWindowsUI\VirtualVivek\src\react-windows-ui npm run build

react-windows-ui-app@2.0.2 build C:\D\Learnings\ReactWindowsUI\VirtualVivek\src\react-windows-ui react-scripts build

Creating an optimized production build... Compiled successfully.

55.23 KB build\static\js\main.d5f5a95d.chunk.js 50.36 KB build\static\js\2.9a8275ea.chunk.js 45.8 KB build\static\css\main.7d03dcc7.chunk.css 796 B build\static\js\runtime-main.e8961d18.js

The project was built assuming it is hosted at /rajendrasp/react-windows-ui/. You can control this with the homepage field in your package.json.

The build folder is ready to be deployed.

Find out more about deployment here:

https://cra.link/deployment

react-windows-ui-app@2.0.2 deploy C:\D\Learnings\ReactWindowsUI\VirtualVivek\src\react-windows-ui gh-pages -d build

Logon failed, use ctrl+c to cancel basic credential prompt. remote: Permission to virtualvivek/react-windows-ui.git denied to rajendrasp. fatal: unable to access 'https://github.com/virtualvivek/react-windows-ui.git/': The requested URL returned error: 403

npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! react-windows-ui-app@2.0.2 deploy: gh-pages -d build npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the react-windows-ui-app@2.0.2 deploy script. npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\rpardesh\AppData\Roaming\npm-cache_logs\2021-05-06T20_22_19_843Z-debug.log

virtualvivek commented 3 years ago

Hi @rajendrasp , to Setup the project locally

Setup react-windows-ui locally

Step1

Fork, Clone repo locally

Step2

cd react-windows-ui

Step3

npm install

Step4

npm start it will run the project demo in your browser

1 react-windows-ui root directory

The overall repository contains all the components including ‣ Demo : includes examples how to use the components ‣ Source : includes scss and icon.ttf source ‣ Lib : include the actual package to be used in your project

2 react-windows-ui source directory

This repo has a sub repo which is the actual react-windows-ui package Here ‣ https://github.com/virtualvivek/react-windows-ui/tree/main/src/lib

npm-scripts.txt summary

npm-scripts.txt is file used for compiling demo repo for the following: ‣ npm run deploy : is used to push gh-pages online github-pages hosting ‣ npm run compile:sass : is used to compile ‣scss source from https://github.com/virtualvivek/react-windows-ui/tree/main/src/source to ‣css https://github.com/virtualvivek/react-windows-ui/tree/main/src/lib/dist

Conclusion

@rajendrasp you are firing npm run deploy command from the root directory that is trying to creating a github-pages build and pushing to

The project was built assuming it is hosted at /rajendrasp/react-windows-ui/. ‣But this repo is not existing so giving you the error

Things to be done

‣If you want to run the demo see steps above ‣If you want to modify the package components are located at : https://github.com/virtualvivek/react-windows-ui/tree/main/src/lib/src/components scss are located at : https://github.com/virtualvivek/react-windows-ui/tree/main/src/source/stylesheet

to compile the scss fire this command at root : npm run compile:sass

rajendrasp commented 3 years ago

Thank you for reply. I could launch the app in web using the setup instructions above. Also, is this app a windows application or just a web app? And if it is a windows app, how to launch it? Appreciate the help. Thanks.

virtualvivek commented 3 years ago

Hi @rajendrasp , Glad to see your approach, Actually This repository is build on intention to provide developers the closest Windows Fluent UI possible, so that you can't need to learn different languages to build Windows native apps ,

Yes, you can build a Native App from your working web app, use electronjs or Node GUI just google ‣how to use electronjs with react app or ‣how to use Node GUI with react app it takes 10-20 mins to build a native windows / mac app if you have your working web app.

Conclusion

It's a web app with windows native ui react components, its been build to generate fully native windows apps using electronjs or NodeGUI.

rajendrasp commented 3 years ago

Thanks a lot Vivek. I really like what you have done with windows ui. I was able to create a desktop native app using electron. Do you develop this lib regularly? Do you plan to keep adding new components to this?

virtualvivek commented 3 years ago

Hi @rajendrasp , 😊 Thank you for your grateful response, Yes i do update this lib on regular basis or sometimes when a new windows update comes with some new bunch of components.