primadona/reactnativerocketboost
0
1<!DOCTYPE html>2<html lang="en">3<head>4 <meta charset="UTF-8">5 <meta name="viewport" content="width=device-width, initial-scale=1.0">6 <title>React Native | Reactify</title>7 <script src="https://cdn.tailwindcss.com"></script>8 <script src="https://unpkg.com/feather-icons"></script>9 <link rel="icon" type="image/x-icon" href="/static/favicon.ico">10 <style>11 .mobile-frame {12 background-image: url('http://static.photos/technology/640x360/42');13 background-size: cover;14 height: 600px;15 width: 300px;16 border-radius: 40px;17 position: relative;18 box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);19 }20 .notch {21 width: 150px;22 height: 25px;23 background: black;24 border-radius: 0 0 20px 20px;25 position: absolute;26 top: 0;27 left: 75px;28 }29 </style>30</head>31<body class="bg-gray-50">32 <nav class="bg-white shadow-sm">33 <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">34 <div class="flex justify-between h-16">35 <div class="flex items-center">36 <i data-feather="code" class="text-indigo-500"></i>37 <span class="ml-2 text-xl font-semibold text-gray-900">Reactify</span>38 </div>39 <div class="flex items-center space-x-8">40 <a href="index.html" class="text-gray-500 hover:text-gray-700">Home</a>41 <a href="react-native.html" class="text-indigo-600 font-medium">React Native</a>42 <a href="dream-diary.html" class="text-gray-500 hover:text-gray-700">Dream Diary</a>43</div>44 </div>45 </div>46 </nav>47 48 <main class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12">49 <div class="flex flex-col md:flex-row items-center gap-12">50 <div class="flex-1">51 <h1 class="text-4xl font-bold text-gray-900 mb-6">52 Build <span class="text-indigo-600">Mobile Apps</span> with React Native53 </h1>54 <p class="text-lg text-gray-600 mb-8">55 Create beautiful, native-quality iOS and Android apps using familiar React concepts.56 All components are truly native and give you the best possible experience.57 </p>58 <div class="space-y-4">59 <div class="flex items-center">60 <i data-feather="check-circle" class="text-green-500 mr-2"></i>61 <span>Write once, run on both iOS and Android</span>62 </div>63 <div class="flex items-center">64 <i data-feather="check-circle" class="text-green-500 mr-2"></i>65 <span>Native performance with JavaScript</span>66 </div>67 <div class="flex items-center">68 <i data-feather="check-circle" class="text-green-500 mr-2"></i>69 <span>Hot reloading for faster development</span>70 </div>71 </div>72 <button class="mt-8 bg-indigo-600 text-white px-6 py-3 rounded-lg hover:bg-indigo-700 transition shadow-md">73 Get Started with React Native74 </button>75 </div>76 <div class="flex-1 flex justify-center">77 <div class="mobile-frame">78 <div class="notch"></div>79 <div class="absolute bottom-4 left-0 right-0 flex justify-center">80 <div class="w-24 h-1 bg-gray-300 rounded-full"></div>81 </div>82 </div>83 </div>84 </div>85 </main>86 87 <script>88 feather.replace();89 </script>90</body>91</html>