{"id":150036,"date":"2026-02-28T17:02:30","date_gmt":"2026-02-28T17:02:30","guid":{"rendered":"https:\/\/devsdata.com\/case-studies\/hiking-app-for-outdoor-enthusiasts\/"},"modified":"2026-02-28T17:02:30","modified_gmt":"2026-02-28T17:02:30","slug":"hiking-app-for-outdoor-enthusiasts","status":"publish","type":"case_study","link":"https:\/\/devsdata.com\/de\/case-studies\/hiking-app-for-outdoor-enthusiasts\/","title":{"rendered":"Hiking app for outdoor enthusiasts"},"content":{"rendered":"<section>\n<h1>Hiking app for outdoor enthusiasts<\/h1>\n\n    <style>`\n        .post-info {\n            display: flex;\n            flex-direction: row;\n            font-family: Montserrat;\n            font-style: normal;\n            font-weight: 500;\n            font-size: 16px;\n            line-height: 150%;\n            letter-spacing: 0.02em;\n            color: #6D7082;\n            \/*padding-top:32px;*\/\n        }\n\n        .info-container .post-info {\n            display: flex;\n            flex-direction: column;\n            justify-content: space-between;\n        }\n\n        .post-info-main {\n            width: 100%;\n            display: flex;\n            flex-wrap: wrap;\n            row-gap: 5px;\n            column-gap: 20px;\n            grid-template-rows: repeat(3, auto);\n            grid-template-columns: 60px max-content auto;\n            margin-bottom:12px;\n        }\n\n        .with-reviewer {\n            flex-wrap: wrap;\n            row-gap: 5px;\n        }\n\n        .author-name {\n            margin-bottom:4px;\n            grid-row-start: 2;\n            text-decoration: underline;\n            color:black !important;\n        }\n\n        .rank-math-breadcrumb {\n            margin-top:20px;\n            position: relative;\n            z-index: 1;\n        }\n\n        .rank-math-breadcrumb p {\n            margin: 0;\n            white-space: nowrap; \n            overflow: hidden;\n            text-overflow: ellipsis;\n            gap: 8px;\n            display: flex;\n        }\n\n        .rank-math-breadcrumb a {\n            color: #6d7082;\n        }\n\n        .rank-math-breadcrumb a:hover {\n            text-decoration: underline;\n            color: #0332c9;\n        }\n\n        .author-avatar {\n            display: flex;\n            justify-content: center;\n            margin-right: 15px;\n            width: fit-content;\n            grid-row-start: span 2;\n            grid-row-end: 4;\n        }\n\n        .author-avatar picture {\n            display: flex;\n            justify-content: center;\n            align-items: center;\n        }\n\n        .author-avatar.clicked {\n            transform: scale(1.1);\n        }\n\n        .post-info .author-avatar img {\n            min-width:44px;\n            height: 44px;\n            width: auto;\n            object-fit: cover;\n            aspect-ratio: 1\/1;\n            filter: grayscale(1);\n            border-radius: 100%;\n            position: relative;\n            top: 2px;\n        }\n\n        .post-info .author_socials {\n            display: flex;\n            flex-direction: row;\n            align-items: center;\n            grid-row-start: 3;\n            grid-column: span 2;\n            gap: 15px;\n            list-style-type: none;\n            padding: 0;\n            margin: 0;\n        }\n\n        .post-info .author_socials li a {\n            display: flex;\n            align-item: center;\n            text-decoration: none;\n        }\n\n        .author_socials a svg {\n            width: 16px;\n            height: 16px;\n            transition: 0.3s;\n            color: #000;\n        }\n      \n        .author_socials li:hover svg {\n            color: #0332c9;\n        }\n\n        .right-info a {\n            width: fit-content;\n            color: unset;\n        }\n\n        .right-info a:hover {\n            text-decoration: underline;\n        }\n\n        .post-info .clock {\n            position: relative;\n            padding-right: 5px;\n            top: 2px;\n        }\n\n        .post-info .arrow {\n            position: relative;\n            margin-left: 10px;\n            margin-right: 10px;\n            transition: .2s;\n            height: 6px;\n            bottom: 1px;\n        }\n        .post-info .post-info-separator {\n            padding-right: 3px;\n            padding-left: 3px;\n        }\n\n        .reviewer-info {\n            display: flex;\n            flex-direction:column;\n            justify-content: center;\n            align-items: flex-start;\n            grid-row-start: 2;\n            align-self: start;\n            justify-self: end;\n            font-family: \"Montserrat\", arial;\n            color: #000;\n        }\n\n        .reviewer-info.the_first_row {\n            justify-self: start;\n            grid-row-start: 1;\n            grid-column: span 3;\n        }\n\n        .meta-checkmark {\n            width: 20px;\n            height: auto;\n        }\n\n        .reviewer-info a {\n            margin-left: 0;\n            color: #000;\n            text-decoration: underline;\n        }\n        .reviewer-info a:hover {\n            color: #0332c9;\n        }\n        .reviewer-info a:visited {\n            color: #551a8b;\n        }\n        .reviewer-info a:active {\n            color: #0332c9;\n        }\n        .language-dropdown-container {\n            display: inline-block;\n            width: 200px;\n        }\n\n        .language_switcher {\n            display: inline-flex;\n            align-items: center;\n            flex-direction: row;\n            gap: 5px;\n            vertical-align: middle;\n        }\n        \n        .language_switcher .wpml-ls-legacy-dropdown {\n            width: auto;\n            position: relative;\n            vertical-align: middle;\n        }\n\n        .language_switcher .wpml-ls-legacy-dropdown ul {\n            list-style: none;\n            padding: 0;\n            margin: 0;\n        }\n\n        .language_switcher .wpml-ls-legacy-dropdown .wpml-ls-current-language {\n            position: relative;\n            margin-bottom:0;\n        }\n\n        .language_switcher .wpml-ls-legacy-dropdown .wpml-ls-current-language > a {\n            padding-left:16px !important;\n            display: flex;\n            align-items: center;\n            justify-content: space-between;\n            width: 100%;\n            box-sizing: border-box;\n        }\n\n        .language_switcher .wpml-ls-legacy-dropdown .wpml-ls-sub-menu {\n            display: none;\n            position: absolute;\n            z-index: 10;\n            top: 100%;\n            left: 0;\n            width: 100%;\n            margin: 0;\n            background-color: rgb(238, 238, 238);\n            border-radius: 0 0 8px 8px;\n            overflow: hidden;\n        }\n\n        .language_switcher .wpml-ls-legacy-dropdown .wpml-ls-sub-menu li {\n            display: block;\n            width: 100%;\n            margin-bottom:0;\n        }\n\n        .language_switcher .wpml-ls-legacy-dropdown .wpml-ls-sub-menu li:hover {\n            background-color:rgba(204, 204, 211) !important\n        }\n\n        .language_switcher .wpml-ls-legacy-dropdown .wpml-ls-sub-menu a {\n            display: block;\n            width: 100%;\n            padding: 8px 15px 8px 16px;\n            margin-left: 0;\n            box-sizing: border-box;\n            white-space: nowrap;\n            text-align: left;\n        }\n\n        @media (hover: hover) {\n            .language_switcher .wpml-ls-legacy-dropdown .wpml-ls-current-language:hover > .wpml-ls-sub-menu {\n                display: block;\n            }\n        }\n\n        .language_switcher .wpml-ls-legacy-dropdown .wpml-ls-current-language.wpml-dropdown-open > .wpml-ls-sub-menu {\n            display: block;\n        }\n\n        .language_switcher .wpml-ls-legacy-dropdown .wpml-ls-current-language.wpml-dropdown-open > a.wpml-ls-item-toggle:after {\n            transform: scale(.7) rotate(180deg);\n        }\n\n        .language_switcher .wpml-ls-legacy-dropdown .wpml-ls-current-language.wpml-dropdown-open > .wpml-ls-item-toggle {\n            border-radius: 8px 8px 0 0;\n            background-color: rgba(204, 204, 211);\n        }\n\n        .wpml-ls-legacy-dropdown a:focus {\n            background-color: #FFFFFF;\n        }\n\n        .language_switcher .wpml-ls-legacy-dropdown a:visited {\n            color: #000000 !important;\n        }\n\n        .wpml-ls-legacy-dropdown a.wpml-ls-item-toggle:after {\n            content: \"\";\n            display: inline-block;\n            transform: scale(.7);\n            height: 20px;\n            width: 20px;\n            background: url(\"\/wp-content\/uploads\/2020\/07\/Vector.png\");\n            margin-left: 5px;\n            background-repeat: no-repeat;\n            background-position: center center;\n            background-size: 10px;\n            border: none;\n            position: unset;\n            background-color: #eee;\n            border-radius: 50%;\n            padding: 10px;\n            transition: transform 0.2s ease-in-out;\n            vertical-align: middle;\n            flex-shrink: 0;\n        }\n\n        .language_switcher a {\n            border: none;\n            padding: 10px 15px;\n        }\n\n        .wpml-ls-legacy-dropdown a.wpml-ls-item-toggle {\n            padding: 0 5px 0 2px !important;\n        }\n\n        @media (hover: hover) {\n            .wpml-ls-sub-menu a.wpml-ls-link:hover,\n            .language_switcher .wpml-ls-legacy-dropdown a.wpml-ls-item-toggle:hover {\n                background-color: rgba(204, 204, 211);\n                color: #000000 !important;\n                text-decoration: none;\n            }\n        }\n\n        .wpml-ls-sub-menu {\n            border: none !important;\n            background-color: transparent;\n        }\n\n        .wpml-ls-sub-menu a {\n            background-color: #FFFFFF;\n        }\n\n        .wpml-ls-current-language .wpml-ls-item-toggle {\n            border-radius: 8px;\n        }\n\n        @media (hover: hover) {\n            .wpml-ls-current-language:hover .wpml-ls-sub-menu a {\n                background-color: rgb(238, 238, 238) !important;\n            }\n\n            .wpml-ls-current-language .wpml-ls-sub-menu a:hover,\n            a.wpml-ls-item-toggle:hover:after {\n                background-color: rgba(204, 204, 211) !important;\n            }\n\n            .wpml-ls-current-language:hover a.wpml-ls-item-toggle:after {\n                transform: scale(.7) rotate(180deg);\n            }\n\n            .wpml-ls-current-language:hover .language_switcher .wpml-ls-legacy-dropdown a {\n                background-color: rgba(109, 112, 130, 0.1);\n            }\n\n            .wpml-ls-current-language:hover .wpml-ls-item-toggle{\n                border-radius: 8px 8px 0 0;\n            }\n\n            .wpml-ls-current-language:hover .wpml-ls-item:last-child .wpml-ls-link{\n                border-radius: 0 0 8px 8px;\n            }\n        }\n\n        .wpml-ls-current-language.wpml-dropdown-open .wpml-ls-sub-menu a {\n            background-color: rgb(238, 238, 238) !important;\n        }\n\n        .wpml-ls-current-language.wpml-dropdown-open .wpml-ls-item:last-child .wpml-ls-link{\n            border-radius: 0 0 8px 8px;\n        }\n\n        ul.language-list {\n            \/*min-height: 71px;*\/\n            margin: 0;\n            overflow: hidden;\n            position: absolute;\n            display: inline-block;\n            list-style: none;\n            vertical-align: top;\n            background-color: #FFFFFF;\n            padding: 0;\n            z-index: 2;\n        }\n\n        ul.language-list.mobile {\n            border-radius: 10px;\n            border: 1px solid rgba(109, 112, 130, 0.1);\n            margin-left: 10px;\n        }\n\n        .language-list.mobile li:hover {\n            background-color: rgba(109, 112, 130, 0.1)\n        }\n\n        .language-list.mobile li:hover a {\n            color: #000000;\n        }\n\n        .dropdown-arrow {\n            display: inline-block;\n            border-radius: 50%;\n            height: 30px;\n            width: 30px;\n        }\n\n        .dropdown-arrow {\n            background-color: rgba(109, 112, 130, 0.1);\n        }\n\n        .dropdown-arrow:hover {\n            background-color: rgba(109, 112, 130, 0.3);\n        }\n\n        .dropdown-arrow.mobile,\n        .dropdown-arrow.mobile:hover {\n            background-color: unset;\n        }\n\n        .language-list li {\n            padding-left: 10px;\n            cursor: pointer;\n            display: none;\n        }\n\n        .language-list li a {\n            color: #6D7082;\n            text-decoration: none;\n        }\n\n        .language-list li:first-child {\n            display: block;\n        }\n\n        .active li {\n            display: block;\n        }\n\n        .rotated {\n            transform: rotate(180deg);\n            bottom: 2px !important;\n        }\n        .bookmark {\n            align-self: center;\n            cursor:pointer;\n            display:none;\n        }\n        \n        .article h1 + p,\n        .article h1 + p + p {\n            margin: 0;\n            margin-bottom: 0 !important;\n        }\n\n        .info-container{\n            \/*min-height:150px;*\/\n            direction: ltr;\n            display: flex;\n            flex-direction: column;\n            justify-content: space-between;\n            padding-top: 20px;\n        }\n        .tags{\n            font-family: \"Montserrat\", sans-serif;\n            display: flex;\n            flex-direction: row;\n            justify-content: flex-start;\n            flex-wrap: wrap;\n            width: 100%;\n            overflow: hidden;\n            font-size: 14px;\n            border-radius: unset;\n            margin-bottom:20px;\n        }\n        .tags a {\n            font-style: normal;\n            line-height: 1.75em;\n            border: 0.5px solid #e2e5e9;\n            margin-right: 7px;\n            margin-top: 7px;\n            transition: 0.2s;\n            transition-property: background;\n            border-radius: 5px;\n            padding: 0.2em 0.8em;\n            color: black;\n        }\n        .tags a:hover {\n            background-color: #c1c7d0;\n        }\n\n        .tags a:visited {\n            color: #000;\n        }\n        .tags a:active {\n            color: #000;\n        }\n        .default-a:focus {\n            background-color: unset;\n        }\n\n        .default-a:hover{\n            text-decoration: underline;\n        }\n        .separator {\n        color:black !important;\n        font-weight:600;\n        }\n        .last {\n        color:black !important;\n        font-weight:600;\n        }\n        @media screen and (max-width:1034px) {\n        .author_links {\n        margin-right:auto;\n        }\n        .reviewer-info {\n        width: 100%;\n        }\n        }\n        @media screen and (max-width:767px) {\n        .language_switcher {\n        display: flex;\n        margin-top: 5px;\n        }\n        }\n        @media screen and (max-width:490px) {\n        .review-lowres {\n        display:flex !important;\n        }\n        .review-highres {\n        display:none !important;\n        }\n        .author_links {\n        margin-right:36px !important;\n        } \n        }\n    <\/style>\n    <div><nav aria-label=\"breadcrumbs\" class=\"rank-math-breadcrumb\"><p><span class=\"last\">Home<\/span><\/p><\/nav><\/div>\n    \n    <div class=\"info-container\">\n    <div class=\"post-info with-reviewer\">\n        <div class=\"post-info-main\">\n            <div class=\"author-avatar\">\n                <picture>\n                        <source\n                            srcset=\"https:\/\/devsdata.com\/wp-content\/uploads\/2024\/11\/tompotanski-new-min.webp\" type=image\/webp> \n                        <source \n                            srcset=\"https:\/\/devsdata.com\/wp-content\/uploads\/2024\/11\/tompotanski-new-min.jpg\" type=\"image\/jpeg\">\n                        <img decoding=\"async\" \n                            class=\"avatar lazyload\"\n                            width=\"64\" \n                            height=\"64\"\n                            src=\"https:\/\/devsdata.com\/wp-content\/uploads\/2024\/11\/tompotanski-new-min.jpg\"\n                            alt=\"avatar\"\n                            loading=\"lazy\"\n                            title=\"Tom Potanski\"\n                        >\n                <\/picture>\n            <\/div>\n            <div style=\"display:flex; flex-direction:column;margin-right:auto;\" class=\"author_links\">\n            <a href=\"\/author\/tom-potanski\/\" class=\"author-name\">Tom Potanski<\/a>\n            <ul class=\"author_socials\">\n            <li>\n                <a href=\"https:\/\/www.linkedin.com\/in\/tompotanski\/\" target=\"_blank\" rel=\"nofollow noopener noreferrer\" aria-label=\"Tom Potanski on Linkedin\">\n                    <svg version=\"1.0\" fill=\"currentColor\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 448 512\" aria-hidden=\"true\">\n                            <g id=\"linkedin5_layer\">\n                                <path d=\"M416 32H31.9C14.3 32 0 46.5 0 64.3v383.4C0 465.5 14.3 480 31.9 480H416c17.6 0 32-14.5 32-32.3V64.3c0-17.8-14.4-32.3-32-32.3zM135.4 416H69V202.2h66.5V416zm-33.2-243c-21.3 0-38.5-17.3-38.5-38.5S80.9 96 102.2 96c21.2 0 38.5 17.3 38.5 38.5 0 21.3-17.2 38.5-38.5 38.5zm282.1 243h-66.4V312c0-24.8-.5-56.7-34.5-56.7-34.6 0-39.9 27-39.9 54.9V416h-66.4V202.2h63.7v29.2h.9c8.9-16.8 30.6-34.5 62.9-34.5 67.2 0 79.7 44.3 79.7 101.9V416z\" data-hs-event-238572417=\"1\"><\/path>\n                            <\/g>\n                        <\/svg>\n                <\/a>\n            <\/li>\n            <li>\n                <a href=\"https:\/\/www.crunchbase.com\/person\/tom-potanski\" target=\"_blank\" rel=\"nofollow noopener noreferrer\" aria-label=\"Tom Potanski on Crunchbase\">\n                    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" fill=\"currentColor\" width=\"800px\" height=\"800px\" viewBox=\"0 0 24 24\" role=\"img\">\n                            <title>Crunchbase icon<\/title>\n                            <path d=\"M21.6 0H2.4A2.41 2.41 0 0 0 0 2.4v19.2A2.41 2.41 0 0 0 2.4 24h19.2a2.41 2.41 0 0 0 2.4-2.4V2.4A2.41 2.41 0 0 0 21.6 0zM7.045 14.465A2.11 2.11 0 0 0 9.84 13.42h1.66a3.69 3.69 0 1 1 0-1.75H9.84a2.11 2.11 0 1 0-2.795 2.795zm11.345.845a3.55 3.55 0 0 1-1.06.63 3.68 3.68 0 0 1-3.39-.38v.38h-1.51V5.37h1.5v4.11a3.74 3.74 0 0 1 1.8-.63H16a3.67 3.67 0 0 1 2.39 6.46zm-.223-2.766a2.104 2.104 0 1 1-4.207 0 2.104 2.104 0 0 1 4.207 0z\"\/>\n                        <\/svg>\n                <\/a>\n            <\/li>\n            <li>\n                <a href=\"https:\/\/medium.com\/@tompotanski\" target=\"_blank\" rel=\"nofollow noopener noreferrer\" aria-label=\"Tom Potanski on Medium\">\n                    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" xmlns:xlink=\"http:\/\/www.w3.org\/1999\/xlink\" width=\"800px\" height=\"800px\" viewBox=\"0 -55 256 256\" version=\"1.1\" preserveAspectRatio=\"xMidYMid\">\n                        <g>\n                            <path d=\"M72.2009141,1.42108547e-14 C112.076502,1.42108547e-14 144.399375,32.5485469 144.399375,72.6964154 C144.399375,112.844284 112.074049,145.390378 72.2009141,145.390378 C32.327779,145.390378 0,112.844284 0,72.6964154 C0,32.5485469 32.325326,1.42108547e-14 72.2009141,1.42108547e-14 Z M187.500628,4.25836743 C207.438422,4.25836743 223.601085,34.8960455 223.601085,72.6964154 L223.603538,72.6964154 C223.603538,110.486973 207.440875,141.134463 187.503081,141.134463 C167.565287,141.134463 151.402624,110.486973 151.402624,72.6964154 C151.402624,34.9058574 167.562834,4.25836743 187.500628,4.25836743 Z M243.303393,11.3867175 C250.314,11.3867175 256,38.835526 256,72.6964154 C256,106.547493 250.316453,134.006113 243.303393,134.006113 C236.290333,134.006113 230.609239,106.554852 230.609239,72.6964154 C230.609239,38.837979 236.292786,11.3867175 243.303393,11.3867175 Z\" fill=\"currentColor\"><\/path>\n                        <\/g>\n                    <\/svg>\n                <\/a>\n            <\/li><\/ul>\n            <\/div>\n            <div class=\"reviewer-info\"> \n                                                                            <span style=\"color:#6D7082;\" class=\"\">\n                Last updated on \n                28. Februar 2026 \n                <span class=\"post-info-separator\">| <\/span> \n                3 min read\n                \n            <\/span>\n                            <\/div>\n        \n        <\/div>\n    <\/div>\n    <div class=\"bookmark\">\n        <img decoding=\"async\" src=\"\/wp-content\/uploads\/2020\/08\/bookmark-add-2-1.svg\" alt=\"bookmark\" title=\"\">\n    <\/div>\n    <div class=\"tags\"><\/div>\n    <\/div>\n    <script type=\"module\" defer>\n      document.addEventListener(\"DOMContentLoaded\", function () {\n    \/\/ Get the current path from the URL\n    const path = window.location.pathname;\n\n    \/\/ Check if it starts with \/case-studies\n        if (path.startsWith(\"\/case-studies\")) {\n        const tagsElement = document.querySelector(\".tags\");\n        if (tagsElement) {\n        tagsElement.style.marginBottom = \"0\";\n        }\n        }\n        });\n        Array.from(document.getElementsByClassName(\"separator\")).forEach(el => {\n            el.textContent = \" > \";\n        });\n\n            var wpmlToggle = document.querySelector(\".language_switcher .wpml-ls-item-toggle\");\n            if (wpmlToggle) {\n                wpmlToggle.addEventListener(\"click\", function(e) {\n                    e.preventDefault();\n                    e.stopPropagation();\n                    var currentLang = this.closest(\".wpml-ls-current-language\");\n                    if (currentLang) {\n                        currentLang.classList.toggle(\"wpml-dropdown-open\");\n                    }\n                });\n                document.addEventListener(\"click\", function(e) {\n                    var openDropdown = document.querySelector(\".wpml-ls-current-language.wpml-dropdown-open\");\n                    if (openDropdown && !openDropdown.contains(e.target)) {\n                        openDropdown.classList.remove(\"wpml-dropdown-open\");\n                    }\n                });\n            }\n\n            var languageList = document.querySelector(\"#language-list\");\n            var dropdownArrow = document.querySelector(\".dropdown-arrow\");\n\n            if(languageList){\n                languageList.addEventListener(\"click\", () => {\n                    languageList.classList.toggle(\"active\");\n                    document.querySelector(\"#arrow\").classList.toggle(\"rotated\");\n                })\n            }\n                \n            function handleViewportChange() {\n                if(languageList) {\n                    if (window.innerWidth < 1280) {\n                        if(!languageList.classList.contains(\"mobile\")) {\n                            languageList.classList.add(\"mobile\");\n                            dropdownArrow.classList.add(\"mobile\");\n                        }\n                    } else {\n                        if(languageList.classList.contains(\"mobile\")) {\n                            languageList.classList.remove(\"mobile\");\n                            dropdownArrow.classList.remove(\"mobile\");\n                        }\n                    }\n                };\n            };\n\n            \/\/ If there is a small\/no space between reviewer and author name, reviewer moves to the first row\n            function update_post_info_layout() {\n                const author_name_element = document.querySelector(\".author-name\");\n                const reviewer_element = document.querySelector(\".reviewer-info\");\n                const post_info_container = document.querySelector(\".post-info\");\n\n                if(reviewer_element) {\n                    let distance_next_to_author, reviewer_fits_next_to_author; \n                    if(post_info_container && author_name_element) {\n                        distance_next_to_author = post_info_container.getBoundingClientRect().right - author_name_element.getBoundingClientRect().right;\n                        reviewer_fits_next_to_author = distance_next_to_author - reviewer_element.clientWidth >= 15;\n                    }\n\n                    if(!reviewer_fits_next_to_author) {\n                        reviewer_element.classList.add(\"the_first_row\");\n                    } else if (reviewer_fits_next_to_author && reviewer_element.classList.contains(\"the_first_row\")) {\n                        reviewer_element.classList.remove(\"the_first_row\");\n                    }\n                }\n            }\n\n            handleViewportChange();\n            update_post_info_layout();\n             \n            window.addEventListener(\"resize\", () => {\n                handleViewportChange();\n                update_post_info_layout();\n            });\n    <\/script>\n<p><span class=\"img-container\">\n<picture><source srcset=\"\/wp-content\/uploads\/2024\/07\/hiking_app.webp\" type=\"image\/webp\" \/><source srcset=\"\/wp-content\/uploads\/2024\/07\/hiking_app.png\" \/><img loading=\"lazy\" decoding=\"async\" class=\"lazyload\" src=\"\/wp-content\/uploads\/2024\/07\/hiking_app.png\" width=\"640\" height=\"408\" alt=\"case study image\" title=\"\"><\/picture>\n<\/span><\/p>\n<div class=\"download-button-container\"><a class=\"case-study-download-button\" href=\"\/wp-content\/themes\/intentionally-blank\/assets\/case_studies\/travel_app\/travel_app.pdf\" target=\"_blank\" rel=\"noopener\">Download as PDF<\/a><\/div>\n<p>Navigation app for hikers in Norway<br \/>\n<\/section>\n<section>\n<h2>Project Overview<\/h2>\n<p>Hiking app is a mobile application for outdoor enthusiasts who want to explore Norway. It offers a number of functionalities that significantly improve the experience of touring the country. It contains a database of tourist attractions such as trekking, cycling and climbing routes, restaurants, hotels, equipment rentals etc. All of the attractions can be conveniently browsed from the map or searched using filters.<br \/>\n<\/section>\n<section>\n<h2>Functionality<\/h2>\n<p>Users of the app form one big community and can contribute and expand the database by adding their outdoor activity preferences and tourist attraction information directly on the maps. Users can post comments, leave ratings and reviews so that other community members can benefit from their experience. Moreover, they can add the selected attraction on the map as their destination, making it easier to navigate and reach their destination. <\/p>\n<p>Users can also create groups to organize trips together, communicate and share tips. It is worth mentioning that the application is integrated with MET Norway meteorological warnings and offers the most current and up-to-date weather forecasts for a given region. <\/p>\n<p>Owners of equipment rentals, sports facilities, bars and other attractions can also advertise here (paid in-app ads) to attract more enthusiasts. Ads are displayed based on the user&#8217;s geolocation. The application was downloaded over 13 thousand times. Rating is high (4.8 on Android and 4.5 on iOS) and the application itself gathers a vivid community of users adding comments about destinations to the app.<br \/>\n<\/section>\n<section>\n<h2>High user rating<\/h2>\n<p>The application has reached a very high rating score of 4.8 on Google Play Store with almost 80 reviews, and more than <span class=\"formatted-number\">13000<\/span> downloads.<br \/>\n<\/section>\n<section>\n<h2>Technologies<\/h2>\n<p>Modern, cutting-edge mobile technology frameworks for better product quality.<\/p>\n<ul>\n<li>To build the app, the React Native technology has been used. Main difference between it and original React is that React Native uses native components instead of web components as building blocks.<\/li>\n<li>The TypeScript is quickly gaining popularity as an open-source framework, which is developed and maintained by Microsoft. It allows to produce a maintainable code of very high quality.<\/li>\n<li>Due to the growing popularity of the app, it becomes harder and harder to control the state of the components. And here comes Redux which is a state controller based on Flux Facebook architecture developed to help to write applications that behave consistently, run in different environments, and are easy to test.<\/li>\n<li>Usage of Redux-saga which is a middleware library for Redux makes the app easier to manage, more efficient to execute, easier to test, and better at handling failures.<\/li>\n<li>The Firebase that has been used is a toolset to build, improve and grow the app. It allows developers to focus on creating the best possible user experience.<\/li>\n<li>SendBird provides the widely used development kit allowing developers to quickly build very effective chat interfaces for their services.<\/li>\n<li>To achieve the highest quality, the app is based on Mapbox and OpenStreetMap, which provide very interactive and customizable vector maps.<\/li>\n<\/ul>\n<\/section>\n<div class=\"download-button-container\"><a class=\"case-study-download-button\" href=\"\/wp-content\/themes\/intentionally-blank\/assets\/case_studies\/travel_app\/travel_app.pdf\" target=\"_blank\" rel=\"noopener\">Download as PDF<\/a><\/div>\n\n        <section class=\"author_section_container\">\n            \n            <p class=\"contact_on_twitter\">\n                Any questions or comments? Let me know on \n                <a href=\"https:\/\/twitter.com\/tompotanski\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">Twitter\/X<\/a>.\n            <\/p> \n        \n            <div class=\"schedule-consultation\">\n                <div class=\"block-contact\">\n                    <p>Discover how IT recruitment and staffing can address your talent needs. Explore trending regions \n        like Poland, Portugal, Mexico, Brazil and more. <\/p>\n                <\/div>\n                <div class=\"contact-us-show schedule-consultation-button\">\n                    \ud83d\uddd3\ufe0f\n                    <span>Schedule a consultation<\/span>\n                <\/div>\n            <\/div>\n            <div class=\"author_section\">\n                <div class=\"author_photo_container\">\n                    <picture>\n                        <source srcset=\"https:\/\/devsdata.com\/wp-content\/uploads\/2024\/11\/tompotanski-new-min.webp\" type=\"image\/webp\"> \n                        <source srcset=\"https:\/\/devsdata.com\/wp-content\/uploads\/2024\/11\/tompotanski-new-min.jpg\" type=\"image\/jpeg\">\n                        <img decoding=\"async\" class=\"avatar lazyload\" width=\"64\" height=\"64\" src=\"https:\/\/devsdata.com\/wp-content\/uploads\/2024\/11\/tompotanski-new-min.jpg\" alt=\"avatar\" loading=\"lazy\" title=\"Tom Potanski\" >\n                    <\/picture>\n                    <a class=\"read_full_bio\" href=\"\/author\/tom-potanski\/\" aria-label=\"Read more from Tom Potanski\">Read full bio<\/a>\n                <\/div>\n                <div class=\"author_info_container\">\n                    <div class=\"author_info\" data-role=\"Author\">\n                        <h4 id=\"author_title\">\n                            <a href=\"\/author\/tom-potanski\/\" aria-label=\"Read more from Tom Potanski\">Tom Potanski<\/a>\n                            <span class=\"position\">Managing Director<\/span>\n                        <\/h4>\n                    <\/div>\n                <\/div>\n                <div class=\"author_about\">\n                    <span>Passionate and experienced technology leader. Combining business and technology, helping American clients find exceptional technical talent in Europe and LatAm.<\/span>\n                    <div class=\"links\">\n                        <ul class=\"author_socials\">\n            <li>\n                <a href=\"https:\/\/www.linkedin.com\/in\/tompotanski\/\" aria-label=\"Check out Tom Potanski on LinkedIn\" target=\"_blank\" rel=\"nofollow noreferrer noopener\">\n                    <svg version=\"1.0\" fill=\"currentColor\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 448 512\" aria-hidden=\"true\">\n                        <g id=\"linkedin5_layer\">\n                            <path d=\"M416 32H31.9C14.3 32 0 46.5 0 64.3v383.4C0 465.5 14.3 480 31.9 480H416c17.6 0 32-14.5 32-32.3V64.3c0-17.8-14.4-32.3-32-32.3zM135.4 416H69V202.2h66.5V416zm-33.2-243c-21.3 0-38.5-17.3-38.5-38.5S80.9 96 102.2 96c21.2 0 38.5 17.3 38.5 38.5 0 21.3-17.2 38.5-38.5 38.5zm282.1 243h-66.4V312c0-24.8-.5-56.7-34.5-56.7-34.6 0-39.9 27-39.9 54.9V416h-66.4V202.2h63.7v29.2h.9c8.9-16.8 30.6-34.5 62.9-34.5 67.2 0 79.7 44.3 79.7 101.9V416z\" data-hs-event-238572417=\"1\"><\/path>\n                        <\/g>\n                    <\/svg>\n                <\/a>\n            <\/li>\n            <li>\n                <a href=\"https:\/\/twitter.com\/tompotanski\" aria-label=\"Check out Tom Potanski on Twitter\" target=\"_blank\" rel=\"nofollow noreferrer noopener\">\n                    <svg viewBox=\"0 0 512 512\" class=\"scriptlesssocialsharing__icon twitter\" fill=\"currentColor\" height=\"1em\" width=\"1em\" aria-hidden=\"true\" focusable=\"false\" role=\"img\">\n                        <path d=\"M389.2 48h70.6L305.6 224.2 487 464H345L233.7 318.6 106.5 464H35.8L200.7 275.5 26.8 48H172.4L272.9 180.9 389.2 48zM364.4 421.8h39.1L151.1 88h-42L364.4 421.8z\"><\/path>\n                    <\/svg>\n                <\/a>\n            <\/li>\n            <li>\n                <a href=\"https:\/\/www.crunchbase.com\/person\/tom-potanski\" aria-label=\"Check out Tom Potanski on Chrunchbase\" target=\"_blank\" rel=\"nofollow noreferrer noopener\">\n                    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" fill=\"currentColor\" width=\"800px\" height=\"800px\" viewBox=\"0 0 24 24\" role=\"img\">\n                        <title>Crunchbase icon<\/title>\n                        <path d=\"M21.6 0H2.4A2.41 2.41 0 0 0 0 2.4v19.2A2.41 2.41 0 0 0 2.4 24h19.2a2.41 2.41 0 0 0 2.4-2.4V2.4A2.41 2.41 0 0 0 21.6 0zM7.045 14.465A2.11 2.11 0 0 0 9.84 13.42h1.66a3.69 3.69 0 1 1 0-1.75H9.84a2.11 2.11 0 1 0-2.795 2.795zm11.345.845a3.55 3.55 0 0 1-1.06.63 3.68 3.68 0 0 1-3.39-.38v.38h-1.51V5.37h1.5v4.11a3.74 3.74 0 0 1 1.8-.63H16a3.67 3.67 0 0 1 2.39 6.46zm-.223-2.766a2.104 2.104 0 1 1-4.207 0 2.104 2.104 0 0 1 4.207 0z\"\/>\n                    <\/svg>\n                <\/a>\n            <\/li>\n            <li>\n                <a href=\"https:\/\/medium.com\/@tompotanski\" aria-label=\"Check out Tom Potanski on Medium\" target=\"_blank\" rel=\"nofollow noreferrer noopener\">\n                    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" xmlns:xlink=\"http:\/\/www.w3.org\/1999\/xlink\" width=\"800px\" height=\"800px\" viewBox=\"0 -55 256 256\" version=\"1.1\" preserveAspectRatio=\"xMidYMid\">\n                        <g>\n                            <path d=\"M72.2009141,1.42108547e-14 C112.076502,1.42108547e-14 144.399375,32.5485469 144.399375,72.6964154 C144.399375,112.844284 112.074049,145.390378 72.2009141,145.390378 C32.327779,145.390378 0,112.844284 0,72.6964154 C0,32.5485469 32.325326,1.42108547e-14 72.2009141,1.42108547e-14 Z M187.500628,4.25836743 C207.438422,4.25836743 223.601085,34.8960455 223.601085,72.6964154 L223.603538,72.6964154 C223.603538,110.486973 207.440875,141.134463 187.503081,141.134463 C167.565287,141.134463 151.402624,110.486973 151.402624,72.6964154 C151.402624,34.9058574 167.562834,4.25836743 187.500628,4.25836743 Z M243.303393,11.3867175 C250.314,11.3867175 256,38.835526 256,72.6964154 C256,106.547493 250.316453,134.006113 243.303393,134.006113 C236.290333,134.006113 230.609239,106.554852 230.609239,72.6964154 C230.609239,38.837979 236.292786,11.3867175 243.303393,11.3867175 Z\" fill=\"currentColor\"><\/path>\n                        <\/g>\n                    <\/svg>    \n                <\/a>\n            <\/li><\/ul>\n                        <a class=\"recruitment_link\" href=\"\/recruitment\/\" target=\"_blank\" rel=\"noopener noreferrer\">\n                            Read more about our IT staffing services\n                            <svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"https:\/\/www.w3.org\/2000\/svg\">\n                                <path d=\"M5 12H19\" stroke=\"#000\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><\/path>\n                                <path d=\"M12 5L19 12L12 19\" stroke=\"#000\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><\/path>\n                            <\/svg>\n                        <\/a>\n                    <\/div>\n                <\/div>\n            <\/div>\n            <div class=\"tags-author \">\n                \n            <\/div>\n        <\/section>\n    \n","protected":false},"author":1,"featured_media":0,"template":"","class_list":["post-150036","case_study","type-case_study","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/devsdata.com\/de\/wp-json\/wp\/v2\/case_study\/150036","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/devsdata.com\/de\/wp-json\/wp\/v2\/case_study"}],"about":[{"href":"https:\/\/devsdata.com\/de\/wp-json\/wp\/v2\/types\/case_study"}],"author":[{"embeddable":true,"href":"https:\/\/devsdata.com\/de\/wp-json\/wp\/v2\/users\/1"}],"wp:attachment":[{"href":"https:\/\/devsdata.com\/de\/wp-json\/wp\/v2\/media?parent=150036"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}