Shopify Store Finder

Discover small Shopify stores with less than 10 products and under 50K in annual sales.

Loading results...

/* styles.css */ body { font-family: Arial, sans-serif; margin: 0; padding: 0; } header { background-color: #004c3f; color: white; padding: 20px; text-align: center; } h1 { margin: 0; } main { padding: 20px; } #search-container { display: flex; margin-bottom: 20px; } #search-input { flex-grow: 1; padding: 10px; font-size: 16px; } #search-button { padding: 10px 20px; font-size: 16px; background-color: #004c3f; color: white; border: none; cursor: pointer; } #filter-container { margin-bottom: 20px; } #results-container { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 20px; } .store-card { border: 1px solid #ccc; padding: 20px; } .store-name { font-size: 18px; font-weight: bold; margin-bottom: 10px; } .store-url { margin-bottom: 10px; } .store-products, .store-sales { margin-bottom: 5px; } #load-more-button { display: block; margin: 20px auto; padding: 10px 20px; font-size: 16px; background-color: #004c3f; color: white; border: none; cursor: pointer; transition: background-color 0.3s ease; } #load-more-button:hover { background-color: #006653; } footer { background-color: #f0f0f0; padding: 20px; text-align: center; } #loading-indicator { display: none; text-align: center; margin-top: 20px; } // app.js const searchInput = document.getElementById('search-input'); const searchButton = document.getElementById('search-button'); const sortSelect = document.getElementById('sort-select'); const categorySelect = document.getElementById('category-select'); const clearButton = document.getElementById('clear-button'); const resultsContainer = document.getElementById('results-container'); const loadMoreButton = document.getElementById('load-more-button'); const loadingIndicator = document.getElementById('loading-indicator'); let currentPage = 1; let isLoading = false; let totalResults = 0; function showLoading() { loadingIndicator.style.display = 'block'; isLoading = true; } function hideLoading() { loadingIndicator.style.display = 'none'; isLoading = false; } function performSearch(loadMore = false) { if (isLoading) return; if (!loadMore) { currentPage = 1; resultsContainer.innerHTML = ''; totalResults = 0; } const searchQuery = searchInput.value; const sortBy = sortSelect.value; const categories = Array.from(categorySelect.selectedOptions).map(option => option.value); const apiUrl = `https://app.shopify.com/services/store-search/search?q=${encodeURIComponent(searchQuery)}&max_results=10&min_products=1&max_products=9&max_annual_sales=50000&page=${currentPage}&sort_by=${sortBy}&categories=${categories.join(',')}`; showLoading(); fetch(apiUrl) .then(response => { if (!response.ok) { throw new Error(`HTTP error! status: ${response.status}`); } return response.json(); }) .then(data => { const stores = data.stores; if (stores.length === 0 && !loadMore) { resultsContainer.innerHTML = '

No results found. Please try a different search query.

'; loadMoreButton.style.display = 'none'; } else { displayResults(stores); totalResults += stores.length; loadMoreButton.style.display = stores.length === 10 ? 'block' : 'none'; currentPage++; } }) .catch(error => { console.error('Error:', error); let errorMessage = 'An error occurred while fetching the results. '; if (error.message.includes('HTTP error')) { errorMessage += 'The server returned an error. Please try again later.'; } else if (error.message.includes('NetworkError')) { errorMessage += 'There seems to be a problem with your internet connection. Please check and try again.'; } else { errorMessage += 'Please try again later.'; } resultsContainer.innerHTML = `

${errorMessage}

`; loadMoreButton.style.display = 'none'; }) .finally(() => { hideLoading(); }); } function displayResults(stores) { const storeCards = stores.map(store => `

${store.name}

${store.url}

Products: ${store.num_products}

Estimated Annual Sales: $${store.estimated_annual_sales}

`).join(''); resultsContainer.innerHTML += storeCards; } function clearSearch() { searchInput.value = ''; sortSelect.value = 'relevance'; categorySelect.selectedIndex = -1; resultsContainer.innerHTML = ''; loadMoreButton.style.display = 'none'; currentPage = 1; totalResults = 0; savePreferences(); } function savePreferences() { localStorage.setItem('searchQuery', searchInput.value); localStorage.setItem('sortBy', sortSelect.value); localStorage.setItem('categories', JSON.stringify(Array.from(categorySelect.selectedOptions).map(option => option.value))); } function loadPreferences() { const savedSearchQuery = localStorage.getItem('searchQuery'); const savedSortBy = localStorage.getItem('sortBy'); const savedCategories = JSON.parse(localStorage.getItem('categories')); if (savedSearchQuery) { searchInput.value = savedSearchQuery; } if (savedSortBy) { sortSelect.value = savedSortBy; } if (savedCategories) { savedCategories.forEach(category => { const option = categorySelect.querySelector(`option[value="${category}"]`); if (option) { option.selected = true; } }); } } searchButton.addEventListener('click', () => performSearch()); searchInput.addEventListener('keypress', event => { if (event.key === 'Enter') { performSearch(); } }); loadMoreButton.addEventListener('click', () => performSearch(true)); clearButton.addEventListener('click', clearSearch); searchInput.addEventListener('input', savePreferences); sortSelect.addEventListener('change', savePreferences); categorySelect.addEventListener('change', savePreferences); // Load user preferences on page load loadPreferences();