Aplikacja warzywniak

PIszę aplikację warzywniak w językach programowania React oraz C#. Nie wiem jaki jest problem,ale nie chce mi to w ogóle zadziałać. Pierwszy raz piszę w React .

Wrzucam kody z React i C#

Czemu wrzucasz screenshoty zamiast kodu w formie tekstu? Jako tekst łatwiej by nam było uruchomić, przeanalizować, skopiowac do AI

Dlaczego nie należy zamieszczać kodu w postaci obrazków

Co znaczy że nie che zadziałać? React to nie język. Moze napisz samo api a dopiero potem dorabiaj front.

Uruchomiłeś npx create-react-app fruit-vegetable-shop, i to stworzyło Ci projekt w folderze fruit-vegetable-shop. Następnie próbujesz zrobić npm start, i to próbuje uruchomić projekt w aktualnym folderze.

Najpierw zrób:

cd fruit-vegetable-shop

a dopiero potem

npm start

Powinno wstać

Riddle napisał(a):

Uruchomiłeś npx create-react-app fruit-vegetable-shop, i to stworzyło Ci projekt w folderze fruit-vegetable-shop. Następnie próbujesz zrobić npm start, i to próbuje uruchomić projekt w aktualnym folderze.

Najpierw zrób:

Kopiuj

cd fruit-vegetable-shop

a dopiero potem

Kopiuj

npm start

Powinno wstać

Zrobiłem tak mi napisałeś, ale nie mi to odpalić. Zmieniłem moją aplikację
najpierw dałem npm install -g react-cli
następnie npx create-react-app warzywniak-fronntend
potem cd warzywniak-frontend
dodałem tam biblitekę npm install axios react-router-dom
na koniec npm start

zobacz w package.json jakie masz skrypty i czy jest tam skrypt o nazwie "start". I nie mów "nie działa" tylko daj konkretne komunikaty które dostajesz

obscurity napisał(a):

zobacz w package.json jakie masz skrypty i czy jest tam skrypt o nazwie "start". I nie mów "nie działa" tylko daj konkretne komunikaty które dostajesz

Tak mam to

package.json

"scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },

Firo napisał(a):

obscurity napisał(a):

zobacz w package.json jakie masz skrypty i czy jest tam skrypt o nazwie "start". I nie mów "nie działa" tylko daj konkretne komunikaty które dostajesz

Tak mam to

package.json

Kopiuj

"scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },

PS C:\Users\wancz\Desktop\warzywa i owoce> npm start
npm ERR! Missing script: "start"
npm ERR!
npm ERR! Did you mean one of these?
npm ERR! npm star # Mark your favorite packages
npm ERR! npm stars # View packages marked as favorites
npm ERR!
npm ERR! To see a list of scripts, run:
npm ERR! npm run

npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\wancz\AppData\Local\npm-cache_logs\2025-02-14T15_17_57_658Z-debug-0.log
PS C:\Users\wancz\Desktop\warzywa i owoce>

• History restored

npm ERR! Missing script: "start"
npm ERR!
npm ERR! Did you mean one of these?
npm ERR! npm star # Mark your favorite packages
npm ERR! npm stars # View packages marked as favorites
npm ERR!
npm ERR! To see a list of scripts, run:
npm ERR! npm run

npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\wancz\AppData\Local\npm-cache_logs\2025-02-18T16_55_43_475Z-debug-0.log

a uruchamiasz to z tego samego folderu w którym jest package.json?

obscurity napisał(a):

a uruchamiasz to z tego samego folderu w którym jest package.json?

Tak

Może głupie spostrzerzenie, ale w path masz spacje "\Desktop\warzywa i owoce" może to coś robi?
druga kwestia
Napisałeś:

następnie npx create-react-app warzywniak-fronntend
potem cd warzywniak-frontend
dodałem tam biblitekę npm install axios react-router-dom

Jednak zlogu, który wysłałeś wynika, że jesteś w innym katalogu. W miejscu gdzie robisz npm start, napisz dir , aby wylistować pliki i katalogi jakie są. Imho w złym miejscu odpalać

Michalk001 napisał(a):

Może głupie spostrzerzenie, ale w path masz spacje "\Desktop\warzywa i owoce" może to coś robi?
druga kwestia
Napisałeś:

Kopiuj

następnie npx create-react-app warzywniak-fronntend
potem cd warzywniak-frontend
dodałem tam biblitekę npm install axios react-router-dom

Jednak zlogu, który wysłałeś wynika, że jesteś w innym katalogu. W miejscu gdzie robisz npm start, napisz dir , aby wylistować pliki i katalogi jakie są. Imho w złym miejscu odpalać

wpisałem dir i wyszło takie coś
PS C:\Users\wancz\Desktop\warzywa i owoce> dir

Directory: C:\Users\wancz\Desktop\warzywa i owoce

Mode LastWriteTime Length Name

d----- 14.02.2025 15:27 warzywniak-frontend

....

no czyli masz podfolder "warzywniak-frontend" musisz w niego wejść najpierw... a w tym folderze co jesteś teraz nie ma package.json więc dajesz nam tu odpowiedzi bez sprawdzenia

obscurity napisał(a):

....

no czyli masz podfolder "warzywniak-frontend" musisz w niego wejść najpierw... a w tym folderze co jesteś teraz nie ma package.json więc dajesz nam tu odpowiedzi bez sprawdzenia

w folderze warzywniak-frontend mam package.json

Firo napisał(a):

obscurity napisał(a):

....

no czyli masz podfolder "warzywniak-frontend" musisz w niego wejść najpierw... a w tym folderze co jesteś teraz nie ma package.json więc dajesz nam tu odpowiedzi bez sprawdzenia

w folderze warzywniak-frontend mam package.json

To zrób

cd warzywniak-frontend

i potem

npm start

Riddle napisał(a):

Firo napisał(a):

obscurity napisał(a):

....

no czyli masz podfolder "warzywniak-frontend" musisz w niego wejść najpierw... a w tym folderze co jesteś teraz nie ma package.json więc dajesz nam tu odpowiedzi bez sprawdzenia

w folderze warzywniak-frontend mam package.json

To zrób

Kopiuj

cd warzywniak-frontend

i potem

Kopiuj

npm start

Tak zrobiłem i mam błędy
Starting the development server...

One of your dependencies, babel-preset-react-app, is importing the
Failed to compile.

Module not found: Error: Can't resolve './components/ProductList' in 'C:\Users\wancz\Desktop\warzywa i owoce\warzywniak-frontend\src'
ERROR in ./src/App.js 6:0-51
Module not found: Error: Can't resolve './components/ProductList' in 'C:\Users\wancz\Desktop\warzywa i owoce\warzywniak-frontend\src'

ERROR in ./src/App.js 7:0-57
Module not found: Error: Can't resolve './components/ProductDetails' in 'C:\Users\wancz\Desktop\warzywa i owoce\warzywniak-frontend\src'

ERROR in ./src/App.js 8:0-51
Module not found: Error: Can't resolve './components/ProductForm' in 'C:\Users\wancz\Desktop\warzywa i owoce\warzywniak-frontend\src'

ERROR in ./src/App.js 27:39-45
export 'Switch' (imported as 'Switch') was not found in 'react-router-dom' (possible exports: Await, BrowserRouter, Form, HashRouter, HydratedRouter, IDLE_BLOCKER, IDLE_FETCHER, IDLE_NAVIGATION, Link, Links, MemoryRouter, Meta, NavLink, Navigate, NavigationType, Outlet, PrefetchPageLinks, Route, Router, RouterProvider, Routes, Scripts, ScrollRestoration, ServerRouter, StaticRouter, StaticRouterProvider, UNSAFE_DataRouterContext, UNSAFE_DataRouterStateContext, UNSAFE_ErrorResponseImpl, UNSAFE_FetchersContext, UNSAFE_FrameworkContext, UNSAFE_LocationContext, UNSAFE_NavigationContext, UNSAFE_RemixErrorBoundary, UNSAFE_RouteContext, UNSAFE_ServerMode, UNSAFE_SingleFetchRedirectSymbol, UNSAFE_ViewTransitionContext, UNSAFE_createBrowserHistory, UNSAFE_createClientRoutes, UNSAFE_createClientRoutesWithHMRRevalidationOptOut, UNSAFE_createRouter, UNSAFE_decodeViaTurboStream, UNSAFE_deserializeErrors, UNSAFE_getPatchRoutesOnNavigationFunction, UNSAFE_getSingleFetchDataStrategy, UNSAFE_invariant, UNSAFE_mapRouteProperties, UNSAFE_shouldHydrateRouteLoader, UNSAFE_useFogOFWarDiscovery, UNSAFE_useScrollRestoration, createBrowserRouter, createCookie, createCookieSessionStorage, createHashRouter, createMemoryRouter, createMemorySessionStorage, createPath, createRequestHandler, createRoutesFromChildren, createRoutesFromElements, createRoutesStub, createSearchParams, createSession, createSessionStorage, createStaticHandler, createStaticRouter, data, generatePath, isCookie, isRouteErrorResponse, isSession,
matchPath, matchRoutes, parsePath, redirect, redirectDocument, renderMatches, replace, resolvePath, unstable_HistoryRouter, unstable_setDevServerHooks, unstable_usePrompt, useActionData, useAsyncError, useAsyncValue, useBeforeUnload, useBlocker, useFetcher, useFetchers, useFormAction, useHref, useInRouterContext, useLinkClickHandler, useLoaderData, useLocation, useMatch, useMatches, useNavigate, useNavigation, useNavigationType, useOutlet, useOutletContext, useParams, useResolvedPath, useRevalidator, useRouteError, useRouteLoaderData, useRoutes, useSearchParams, useSubmit, useViewTransitionState)

webpack compiled with 4 errors