[docs]: Oppratert README i rot

README.md

@@ -18,28 +18,29 @@ Additional functionality, including user-generated country status and notes, is
 
 - Country list using data fetched from the GraphQL backend.
 - Country detail page using data fetched from the GraphQL backend.
+- Search functionality for countries, with case-insensitive searching performed in the PostgreSQL database.
+- Debounced search input (300 ms) to reduce unnecessary GraphØL requests.
+- Loading, error, and empty-result states for country searches.
 - Apollo Client integration for GraphQL queries and client-side caching.
 - GraphQL resolvers for countries, individual countries, cities, and individual cities.
+- Apollo Server with resolvers that retrieve data from PostgreSQL.
 - Backend support for country search, continent filtering, and pagination.
-- Search bar and country list/detail UI components.
+- PostgreSQL database hosted on the group's NTNU VM, populated with country and city data.
+- Backend deployed on the NTNU VM as a systemd service, allowing it to continue running after SSH logout and restart automatically if the process fails.
 
-Further functionality is planned, including connecting search and filtering controls to the backend, sorting, user-generated country status and notes, and additional accessibility and performance improvements.
+Further functionality is planned, including pagination in the frontend, sorting, additional filtering controls, user-generated country status and notes, and accessibility and performance improvements.
 
 ## **Planned Functionality**
 
-- **Search**: free-text search by country name, case-insensitive, with debouncing to avoid unnecessary API calls.
+- **Result list**: Support for large datasets through pagination or dynamic loading. The current frontend displays up to 20 search results.
 
-- **Result list**: presentation of search results with support for large datasets (pagination or dynamic loading while scrolling).
+- **Sorting and filtering**: Sorting by name/population and filtering by continent/language and Visited/Want to visit. These operations will be performed on the entire dataset in the backend, rather than only on the data loaded into the client.
 
-- **Detailed view**: more information about each country when clicking on a result.
-
-- **Sorting and filtering**: sorting by name/population and filtering by continent/language and Visited/Want to visit. These operations will be performed on the entire dataset in the backend, rather than only on the data loaded into the client.
-
-- **User-generated data**: the ability to mark countries as Visited/Want to visit and add notes, stored persistently in the database.
+- **User-generated data**: The ability to mark countries as Visited/Want to visit and add notes, stored persistently in the database.
 
 - **Accessibility and sustainable web development**: Semantic HTML, ARIA where necessary, and keyboard navigation. Conscious choices regarding data usage, caching, and performance to reduce unnecessary resource consumption. See our [Accessibility and Sustainability Plan](docs/planAccessibilityAndSustainability.md).
 
-- **Responsive design**: adapted for both mobile and desktop.
+- **Responsive design**: Continued improvements for both mobile and desktop.
 
 - See our [design mockups](docs/design.md).
 
@@ -57,6 +58,22 @@ Further functionality is planned, including connecting search and filtering cont
 - **Testing**: Vitest (coming)
 - **Linting/formatting**: ESLint and Prettier
 
+## Architecture and Scalability
+
+The application follows a client-server architecture consisting of three main components:
+
+- **Frontend**: React and TypeScript with Apollo Client for sending GraphQL queries and caching responses.
+- **Backend**: Node.js, TypeScript, and Apollo Server, exposing a GraphQL API and handling requests from the frontend.
+- **Database**: PostgreSQL, storing structured country and city data.
+
+The backend and database are hosted on the group's NTNU VM. The backend runs as a systemd service to remain available independently of active SSH sessions.
+
+To support larger datasets, searching, filtering, and pagination are handled by the backend and database rather than requiring the frontend to load all records. The GraphQL API allows the frontend to request only the data needed for each view.
+
+The dataset currently contains approximately 250 countries and 34,155 cities. Including city data provides a larger dataset for evaluating database queries and scalability.
+
+For deployment details, see [Backend Deployment](docs/backendDeployment.md).
+
 ## **Getting Started**
 
 ### Prerequisites
@@ -93,9 +110,19 @@ npm run dev
 
 Open [http://localhost:5173/](http://localhost:5173/) in your browser.
 
-The frontend uses Apollo Client to query the GraphQL backend. By default, the GraphQL endpoint is `http://localhost:3001/graphql`. When connecting to the backend hosted on the NTNU VM, the endpoint is `http://it2810-28.idi.ntnu.no:3001/`. The endpoint can be overridden with the `VITE_GRAPHQL_URL` environment variable.
+The frontend uses Apollo Client to communicate with the GraphQL backend. The backend can either be run locally or accessed through the group's NTNU VM.
+
+For local development using the backend hosted on the VM, connect to the NTNU network or VPN and create a .env. local file in the repository root:
 
-Both the backend and the database connection must be available for country data to load.
+```env
+VITE_GRAPHQL_URL=http://it2810-28.idi.ntnu.no:3001/
+```
+
+`npm run dev`. The backend does not need to be started locally when using the VM endpoint.
+
+For local backend development, follow the instructions above and configure `VITE_GRAPHQL_URL` to point to the locally running GraphQL server (`http://localhost:3001/`).
+
+For more information, see [Backend Deployment](docs/backendDeployment.md).
 
 ### Backend Deployment (NTNU VM)
 
@@ -154,7 +181,17 @@ Data was last fetched on **8 October 2026**.
 
 ## **Use of AI**
 
-(Describe here how and for what purposes AI has been used during development, e.g. for setup, code generation, debugging, or quality assurance of code and documentation.)
+We have used AI tools, including Claude Code and ChatGPT, throughout the development of this project, primarily as support for learning, debugging, and solving technical challenges.
+
+Our typical workflow has been to implement functionality ourselves while using AI to explain relevant concepts, identify errors, and suggest possible improvements rather than generating complete solutions directly.
+
+Examples include working with React and TypeScript, understanding GraphQL queries and resolvers, connecting the frontend to the PostgreSQL database through the backend, and implementing country search with debouncing and appropriate loading and error states.
+
+AI has also been used to help troubleshoot backend deployment on the NTNU VM, configure the systemd service, resolve Git-related issues, and improve technical documentation, including the README.
+
+Using AI to explain concepts and provide feedback on our own code has helped us better understand the technologies used in the project. It has also made debugging and troubleshooting more efficient, particularly when working with unfamiliar tools and configurations.
+
+All AI-generated suggestions have been reviewed and evaluated before being applied, and the group remains responsible for the final implementation.
 
 ## **Project Structure**
 
@@ -171,7 +208,11 @@ data/
 ├── cities.json
 └── countries.json
 
+deploy/
+└── t28-backend.service       # systemd service configuration
+
 docs/
+├── backendDeployment.md     # Backend deployment on NTNU VM
 ├── databaseSetup.md
 ├── design.md
 └── planAccessibilityAndSustainability.md